Webpack kullanarak ES6 kodunu nasıl küçültün?

Question

Webpack kullanıyorum ve sitemi dağıtmak istiyorum. Ben küçültmek ve benim JavaScript kodu paket halinde, bu hatayı var:

İşte

Parse error: Unexpected token: name (Button)

benim değil paketlenmiş kodudur: paketlenmiş 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; 
    } 
} 

Not kelime export kaldırılır. Geliştirme aşamasında, atılan hiçbir hata yok. Ben yukarıdan hata var eğer doğruysa ben, hiçbir hata ettik, yanlış olarak PROD değiştirirseniz

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, 
      }, 
     }) 
    ] : [] 
}; 

: Burada WebPack benim yapılandırma dosyasını bulabiliriz. Sorum şu: WebPartında ES6'yı etkinleştirebilir miyim?

Answer 1

Yine de buna bir cevap arıyorsanız emin olun, ancak şimdi bir web paketi eklentisi olarak uglifyjs-webpack-plugin beta sürümünü ekleyebilir ve ES6 kodunu minimize edebilir uglify-es kullanacaktır. senin webpack.config.js içinde

npm install uglifyjs-webpack-plugin 

ve sonra:

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

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

Answer 2

bu varsayılan webpack yapılandırma Having:

> 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 

bir esnext hedefle benim için çalıştı aşağıdaki:

npm i -D uglifyjs-webpack-plugin 

şimdi yerel uglifyjs-webpack-eklentisi veren 63.210

:

> 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 
] 

Bkz ilgili güncelleyicisinin mesajlar:

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