1. 图片单独打包
module: {
loaders: [
{
test: /\.(jpe?g|png|gif|svg)$/,
loader: 'url?limit=8192&name=./assets/img/[hash:8].[name].[ext]',
},
]
}
2. 单独打包成一个css
注：
# for webpack 3 npm install --save-dev extract-text-webpack-plugin
# for webpack 2 npm install --save-dev extract-text-webpack-plugin@2.1.2
# for webpack 1 npm install --save-dev extract-text-webpack-plugin@1.0.1
module.exports = {
plugins: [
new ExtractTextPlugin("styles.css"),
],
module: {
loaders: [
{
test: /\.css$/,
loader: ExtractTextPlugin.extract("style-loader","css-loader")
},
{
test: /\.scss$/,
loader: "style!css!sass"
},
{
test: /\.less$/,
loader: "style!css!less"
},
]
}
}
3.提取公共类库
//首先在entry 声明第三方库
entry: {
app: ['index.js'],
//app: path.resolve(APP_PATH, 'index.js'),
//添加要打包在vendeors里面的库
vendors: ['jquery', 'moment']
},
plugins: {
//把入口文件里面的数组打包成vendors.js
new webpack.optimize.CommonsChunkPlugin('vendors', 'vendors.js'),
}
4.js压缩
plugins: [
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: true
},
output: {
comments: false,
}
}),
]
