Open wuye1200 opened 5 years ago
npm install webpack-cli --save-d
const path = require("path");
const webpack = require("webpack");
module.exports = {
entry: {
vendor: [
"vue-router/dist/vue-router.esm.js",
"vuex/dist/vuex.esm.js",
"axios"
]
},
output: {
path: path.join(__dirname, "public/vendor"),
filename: "[name].dll.js",
library: "[name]_[hash]" // vendor.dll.js中暴露出的全局变量名
},
plugins: [
new webpack.DllPlugin({
path: path.join(__dirname, "public/vendor", "[name]-manifest.json"),
name: "[name]_[hash]",
context: process.cwd()
})
]
};
注意一定要把生成的dll放到public中或者自己去配置 publicPath
package.json中定义运行webpack.dll.conf.js的命令
{
···
"scripts": {
"serve": "npm link typescript && vue-cli-service serve",
"dll": "webpack -p --progress --config ./webpack.dll.conf.js",
···
},
···
}
<script src="./vendor/vendor.dll.js"></script>
const webpack = require("webpack");
module.exports = {
···
configureWebpack: {
plugins: [
new webpack.DllReferencePlugin({
context: process.cwd(),
manifest: require("./public/vendor/vendor-manifest.json")
})
]
}
···
}