我有以下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,就不会发生这种情况)
我收到以下错误:
来自UglifyJs的app.bundle.js中的错误
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);
答案 0 :(得分:0)
您的配置已损坏:您没有声明单独的规则,而是声明只有一个具有多个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"]
}
];
}