首页 > Web开发 > 详细

webpack多页面配置

时间:2018-11-19 17:03:10      阅读:156      评论:0      收藏:0      [点我收藏+]
const path = require(‘path‘);
const CleanWebpackPlugin = require(‘clean-webpack-plugin‘);
const HtmlWebpackPlugin = require(‘html-webpack-plugin‘);

module.exports = {
entry: {
‘index/index‘: ‘./src/index/index.js‘,
‘login/login‘: ‘./src/login/login.js‘,
},
output: {
filename: ‘[name].[chunkHash:8].js‘,
path: path.resolve(__dirname, ‘dist‘),
 
},

plugins: [
new CleanWebpackPlugin([‘dist‘]),
new HtmlWebpackPlugin({
 
filename: ‘index/index.html‘,
chunks: [‘common/utils‘, ‘common/vendor‘, ‘index/index‘]
}),
 
new HtmlWebpackPlugin({
 
filename: ‘login/login.html‘,
chunks: [‘common/utils‘, ‘common/vendor‘, ‘login/login‘]
})
],

optimization: {
splitChunks: {
cacheGroups: {
vendor: { // 抽离第三方插件
test: /node_modules/, // 指定是node_modules下的第三方包
chunks: ‘initial‘,
name: ‘common/vendor‘, // 打包后的文件名,任意命名
// 设置优先级,防止和自定义的公共代码提取时被覆盖,不进行打包
priority: 10
},
utils: { // 抽离自己写的公共代码,utils这个名字可以随意起
chunks: ‘initial‘,
name: ‘common/utils‘, // 任意命名
minSize: 0 // 只要超出0字节就生成一个新包
}
}
}
},

 
};

webpack多页面配置

原文:https://www.cnblogs.com/siso/p/9983796.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!