原创不易,未经作者允许禁止转载!!
webpack内置DllPlugin帮助生成DLL文件
const path = require("path");
const {DllPlugin} = require("webpack");
const {merge} = require("webpack-merge")
const commonConfig = (isProduction)=>{
return {
context: path.resolve(__dirname, "../"),
entry: {
react:["react","react-dom"]
},
output: {
path:path.resolve(__dirname,"../dll"),
filename:"dll_[name].js",
library:"dll_[name]"
},
plugins: [
new DllPlugin({
name:'[name].manifest.json',
path:path.resolve(__dirname, "../dll/[name].manifest.json")
})
],
}
}
const devConfig = require('./webpack.dev')
const prodConfig = require('./webpack.prod')
module.exports = function (env) {
const isProduction = env.production;
process.env.NODE_ENV = isProduction ? "production" : "development"
const config = isProduction ? prodConfig : devConfig
return merge(commonConfig(isProduction), config)
}
打包完成后,在根目录下会有一个dll文件夹,内有Dll文件和相应manifest.json文件。
new DllReferencePlugin({
context:path.resolve(__dirname, "../"),
manifest:path.resolve(__dirname,"../dll/react.manifest.json")
}),
new AddAssetHtmlWebpackPlugin({
outputPath:"../build/js",
filepath:path.resolve(__dirname, "../dll/dll_react.js")
})