ネイティブは/ asyncとwebpackを待ちます

Question

私はchrome 55+の拡張機能を開発しており、webpack 2を使用してすべてをパックしています。問題は、私がasyncを使い始めたことと、待っていることです。

私が手にエラーがある。このような単純なファイルの場合

ERROR in content_script.js from UglifyJs 
Unexpected token: keyword (function) [./content_script.js:1,0] 
[content_script.js:1630,6] 

：

async function test() { 

} 

私はのために、非ネイティブ非同期コードに変換するバベルを使用したくありませんいずれにしてもchrome 55+をターゲットにしていますが、これを受け入れるようにUglifyJsを設定する方法や、これをサポートする別のバージョンを使用する方法を見つけることができません。

私のWebPACKの設定：

var path = require("path"); 
var webpack = require("webpack"); 
var CopyWebpackPlugin = require("copy-webpack-plugin"); 
var HtmlWebpackPlugin = require("html-webpack-plugin"); 

module.exports = { 
    entry: { 
     "content_script": [ 
      "./content_script.js" 
     ], 
     "browser_action": [ 
      "./browser_action.js" 
     ], 
     "background": [ 
      "./background.js" 
     ], 
     "options": [ 
      "./options.js" 
     ] 
    }, 
    node: { 
     fs: "empty" 
    }, 
    output: { 
     path: __dirname + "/dist", 
     filename: "[name].js" 
    }, 
    plugins: [ 
     new CopyWebpackPlugin([ 
      { from: "manifest.json" } 
     ]), 
     new HtmlWebpackPlugin({ 
      template: path.join(__dirname, "browser_action_popup.html"), 
      inject: true, 
      chunks: ["browser_action"], 
      hash: false, 
      filename: "browser_action_popup.html" 
     }), 
     new HtmlWebpackPlugin({ 
      template: path.join(__dirname, "options.html"), 
      inject: true, 
      chunks: ["options"], 
      hash: false, 
      filename: "options.html" 
     }) 
    ] 
}; 

Answer 1

UglifyJsはまだES2015 +構文を理解していません。代わりに、babiliを使用することができます。これは、babelが理解しているすべての構文で動作します。

ウェブパックの設定でwebpack.optimize.UglifyJsPluginのように使用できるbabili-webpack-pluginがあります。利用可能なオプションのリストについては

const BabiliPlugin = require('babili-webpack-plugin'); 

module.exports = { 
    // ... 

    plugins: [ 
     new BabiliPlugin(options) 
    ] 
}; 

babel-preset-babili optionsを参照してください。

ウェブパックプラグインを含めたくない場合は、babili CLIを使用することもできます。