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, } }), ]