I got 2 related issues:
First: when I run npm run build
the bundle.js
file is not minified but I do get a bundle.js.map
file.
Second: when I run webpack -d
I only get a minified bundle.js
file (and no error) but when I run webpack -p
then I get a bundle.js
that is not minified, a bundle.js.map
, and those errors:
ERROR in ./public/bundle.js from UglifyJs
Unexpected character '`' [./app/config.js:5,0][./public/bundle.js:76,14]
ERROR in ./public/bundle.js from UglifyJs
Unexpected character '`' [./app/config.js:5,0][./public/bundle.js:76,14]
My question(s):
webpack -p
and webpack -d
be the opposite? bundle.js
not minified when I run npm run build
? Unexpected character
errors when I use template strings in my modules? package.json
looks like that:
{
...,
"scripts": {
"build": "webpack --progress --watch"
},
"devDependencies": {
"babel-core": "^6.13.2",
"babel-loader": "^6.2.5",
"babel-preset-es2015-native-modules": "^6.9.4",
"eslint": "^3.3.1",
"eslint-config-airbnb": "^10.0.1",
"eslint-plugin-html": "^1.5.2",
"eslint-plugin-import": "^1.13.0",
"eslint-plugin-jsx-a11y": "^2.1.0",
"eslint-plugin-react": "^6.1.2",
"webpack": "^2.1.0-beta.21"
}
}
while webpack.config.js
is like that:
const webpack = require('webpack'); // eslint-disable-line import/no-extraneous-dependencies
const nodeEnv = process.env.NODE_ENV || 'production';
module.exports = {
entry: {
filename: './app/app.js'
},
output: {
filename: './public/bundle.js'
},
modules: {
loaders: [
{
test: /\.js?$/,
exclude: /node_modules/,
loader: 'babel',
query: {
presets: ['es2015-native-modules']
}
}
]
},
devtool: 'source-map',
plugins: [
// uglify
new webpack.optimize.UglifyJsPlugin({
compress: { warnings: false },
output: { comments: false },
sourceMap: true
}),
new webpack.DefinePlugin({
'process.env': { NODE_ENV: JSON.stringify(nodeEnv) }
})
]
};
I did search both here and Google (and webpack docs…) but I can't find anything useful to me. Thanks!!
UglifyJS2 does not have ES6/Harmony support in its releases yet. However, there's the Harmony branch which allows you to minify/uglify files with ES6 syntax.
I can suggest you an alternative solution which could help you spend less build time to transpile all ES6 to ES5.
Simply specify UglifyJs in your package.json, and let npm handles the dependencies. "uglify-js": "git://github.com/mishoo/UglifyJS2#harmony-v2.8.22",
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.