Jak zminimalizować kod ES6 za pomocą Webpacka?

Question

Używam webpacka i chcę wdrożyć moją witrynę. Gdybym minify i pakiet mój kod JavaScript, mam ten błąd:

Parse error: Unexpected token: name (Button)

Oto moja nie dołączony kod:

'use strict'; 

export class Button { // <-- Error happens on this line 
    constructor(translate, rotate, text, textscale = 1) { 
     this.position = translate; 
     this.rotation = rotate; 
     this.text = text; 
     this.textscale = textscale; 
    } 
} 

Uwaga w kodzie dołączonego słowo kluczowe export zostanie usunięty. W fazie rozwoju nie są zgłaszane żadne błędy. Tutaj można znaleźć mój plik konfiguracyjny WebPacka:

var webpack = require('webpack'); 

var PROD = true; 

module.exports = { 
    entry: "./js/entry.js", 
    output: { 
     path: __dirname, 
     filename: PROD ? 'bundle.min.js' : 'bundle.js' 
    }, 
    module: { 
     loaders: [ 
      { 
       test: /\.css$/, 
       loader: "style-loader!css-loader" 
      } 
     ] 
    }, 
    plugins: PROD ? [ 
     new webpack.optimize.UglifyJsPlugin({ 
      compress: { 
       warnings: false 
      }, 
      output: { 
       comments: false, 
      }, 
     }) 
    ] : [] 
}; 

Jeśli zmienię PROD false, mam żadnego błędu, jeśli jest prawdziwa Mam błąd z góry. Moje pytanie brzmi: czy mogę włączyć ES6 w pakiecie Webpack?

Answer 1

Nie jesteś pewien, czy nadal szukasz odpowiedzi na to pytanie, ale teraz możesz dołączyć wersję beta uglifyjs-webpack-plugin jako wtyczkę do przeglądarki internetowej, która będzie używać uglify-es, która może minimalizować kod ES6.

npm install uglifyjs-webpack-plugin 

a następnie w swoim webpack.config.js:

const Uglify = require("uglifyjs-webpack-plugin"); 

module.exports = { 
    entry: ..., 
    output: ..., 
    plugins: [ 
     new Uglify() 
    ] 
}; 

Answer 2

Mając to domyślny WebPACK config:

> npm list -g uglifyjs-webpack-plugin 
+-- 
| `-- webpack@3.10.0 
| `-- uglifyjs-webpack-plugin@0.4.6 
`-- webpack@3.10.0 
    `-- uglifyjs-webpack-plugin@0.4.6 

następuje pracował dla mnie z esnext cel:

npm i -D uglifyjs-webpack-plugin 

uzyskując teraz lokalnej uglifyjs-WebPACK-plugin:

> npm list uglifyjs-webpack-plugin 
`-- uglifyjs-webpack-plugin@1.2.2  

webpack.config.js

const UglifyJSPlugin = require('uglifyjs-webpack-plugin') 
... 
plugins: [ 
    //new webpack.optimize.UglifyJsPlugin() @0.4.6 doesn't work 
    new UglifyJSPlugin() // @1.2.2 works with esnext 
] 

Zobacz posty powiązanego opiekuna:

• Is ES6+ supported or not?
• Rest parameters not recognized