man*_*uer 1 javascript minify node.js uglifyjs webpack
我现在将我的第一个项目与 webpack 捆绑在一起,除了 webpack 没有缩小我的bundle.min.js代码外,一切都按预期工作。
我很确定我做错了什么,但无法发现错误。
任何帮助,将不胜感激。提前致谢。
我带着我的 webpack.config.js
var webpack = require("webpack");
var ExtractTextPlugin = require("extract-text-webpack-plugin");
var OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
module.exports = {
context: __dirname + "/public",
entry: './app.js',
output: {
path: __dirname + '/dist',
filename: "bundle.min.js"
},
plugins: [
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery"
}),
new webpack.LoaderOptionsPlugin({
minimize: true,
debug: true
}),
new webpack.optimize.UglifyJsPlugin({
beautify: false,
mangle: {
screw_ie8: true,
keep_fnames: true
},
compress: {
screw_ie8: true
},
comments: false
}),
new ExtractTextPlugin("bundle.min.css"),
new OptimizeCssAssetsPlugin()
],
module: {
loaders: [
{
test: /\.css$/,
loader: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader' })
},
{
test: /\.(jpe?g|png|gif|svg)$/i,
use: [
{
loader: "file-loader",
options: {
hash: "sha512",
digest: "hex",
name: "./img/[hash].[ext]"
}
},
{
loader: "image-webpack-loader",
query: {
mozjpeg: {
progressive: true,
},
gifsicle: {
interlaced: false,
},
optipng: {
optimizationLevel: 4,
},
pngquant: {
quality: '75-90',
speed: 3,
},
},
}
]
},
{
test: /\.(eot|svg|ttf|woff|woff2)$/,
use: [
{
loader: "file-loader",
options: {
name: "./fonts/[name].[ext]"
}
}
]
}
]
}
};
Run Code Online (Sandbox Code Playgroud)
Webpack 支持开箱即用的缩小。通过-p在运行时包含标志,webpack它将为您缩小代码。该-p标志是一条捷径--optimize-minimize标志。
跑: webpack -p