webpack - UgifyJSが失敗する

Question

Webpackの設定にUglifyJSプラグインを追加しようとしています。エントリポイントは簡単で、次のようになります。

import Vue from 'vue'; 
import Comp from './components/comp.vue'; 
Vue.component('somecomponent', { 
    render: h => h(Comp) 
}); 

と私が実行しようとするのWebPACK、それはエラーがスローされます。

ERROR in source1.bundle.js from UglifyJs 
Unexpected token: operator (>) [./frontend/source1.js:7,0][source1.bundle.js:80,15] 

私は何をしないのですか？これは私の設定です

const path = require('path'); 
const webpack = require('webpack'); 
const CleanWebpackPlugin = require('clean-webpack-plugin'); 

module.exports = { 
    entry: { 
     source1: './frontend/source1.js', 
     source2: './frontend/source2.js' 
    }, 
    output: { 
     filename: '[name].bundle.js', 
     path: path.resolve(__dirname, 'static/bundles') 
    }, 
    plugins: [ 
     new CleanWebpackPlugin(['static/bundles']), 
     new webpack.optimize.UglifyJsPlugin({ 
      sourceMap: true, 
      compress: { 
       warnings: false 
      } 
     }) 
    ], 
    module: { 
     rules: [ 
      { 
       test: /\.vue$/, 
       loader: 'vue-loader', 
       options: { 
        loaders: { 
        } 
       } 
      } 
     ] 
    }, 
    resolve: { 
     alias: { 
      vue$: 'vue/dist/vue.esm.js' 
     } 
    } 
}; 

Answer 1

Uglifyは現在ES6を処理していません。だから、UglifyJSを通して何かを置く前にまずES5に変換する必要があります。一般的には、これはbabel-loaderで行います。

チェックhttps://github.com/babel/babel-loader

module: { 
    rules: [ 
    { 
     test: /\.js$/, 
     exclude: /(node_modules|bower_components)/, 
     use: { 
     loader: 'babel-loader', 
     options: { 
      presets: ['env'] 
     } 
     } 
    } 
    ] 
} 

Answer 2

UglifyJSは矢印機能をサポートしていますが、あなたの短い手書きの方法が好きではないかもしれません。あなたは...

Vue.component('somecomponent', { 
    render: (h) => { h(Comp) } 
}); 

と同じ結果を得るのですかあなたはこれを実行する必要はありません、これは他の方法で動作していない場合、それは最も可能性の高いUglify.jsとバグです。