的WebPack拋出醜化錯誤

Question

我有以下的WebPack文件：

const path = require('path'); 
const webpack = require('webpack'); 
const ExtractTextPlugin = require('extract-text-webpack-plugin'); 

module.exports = { 
    context: path.resolve(__dirname, './src'), 
    entry: { 
     app: './app.js' 
    }, 
    output: { 
     filename: '[name].bundle.js', 
     path: path.resolve(__dirname, './dist/assets'), 
     publicPath: '/assets', 

    }, 
    devServer: { 
     contentBase: path.resolve(__dirname, './src') 
    }, 
    module: { 
     rules: [ 
      { 
       test: /\.js$/, 
       exclude: [/node-modules/], 
       use: [ 
        { 
         loader: 'babel-loader', 
         options: { presets: [ 'es2015' ] } 
        } 
       ], 
       test: /\.css$/, 
       use: ExtractTextPlugin.extract({ 
        use: [{ 
         loader: 'css-loader', 
         options: { importLoaders: 1 } 
        }] 
       }), 
       test: /\.(sass|scss)$/, 
       use: [ 
        'style-loader', 
        'css-loader', 
        'sass-loader' 
       ] 
      } 
     ] 
    }, 
    resolve: { 
     modules: [ 
      path.resolve(__dirname, './src'), 
      'node_modules' 
     ] 
    }, 
    plugins: [ 
     new webpack.optimize.CommonsChunkPlugin({ 
      name: 'common' 
     }), 
     new ExtractTextPlugin({ 
      filename: '[name].bundle.css', 
      allChunks: true 
     }) 
    ] 
} 

當我運行：

node_modules /的.bin/webpacl -p（如果我運行它不會發生node_modules/.bin文件/的WebPack -d）

我收到以下錯誤：在app.bundle.js

ERROR從UglifyJs

Unexpected token: name (name) [app.bundle.js:11,4] 

APP.JS

import styles from './css/style.scss'; 

let name = "alessandro"; 
var showName = name => { 
    console.log(name); 
} 

showName(name); 

Answer 1

你的配置被打破：不是宣佈獨立的規則，你只申報一個規則有多個test/use/exclude領域（覆蓋彼此）。

這可能會導致您的JS不會被轉發，因此Uglify會拋出一個錯誤。

試試這個：

module: { 
    rules: [ 
    { 
     test: /\.js$/, 
     exclude: [/node-modules/], 
     use: [ 
     { 
      loader: "babel-loader", 
      options: { presets: ["es2015"] } 
     } 
     ] 
    }, 
    { 
     test: /\.css$/, 
     use: ExtractTextPlugin.extract({ 
     use: [ 
      { 
      loader: "css-loader", 
      options: { importLoaders: 1 } 
      } 
     ] 
     }) 
    }, 
    { 
     test: /\.(sass|scss)$/, 
     use: ["style-loader", "css-loader", "sass-loader"] 
    } 
    ]; 
}