多页面应用
howcode 2022-07-19 0 webpack
# entry 配置
module.exports = {
...
entry: {
main: {
// 将多个文件打包合成一个文件
import: ['app1.js', 'app2.js'],
dependOn: 'jquery',
filename: '[name].js'
},
main2: {
import: 'app3.js',
dependOn: 'jquery',
filename: 'page/[name].js'
},
// 第三方库依赖
jquery: 'jQuery',
finename: '[name].js'
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
视频教程：https://www.bilibili.com/video/BV1YU4y1g745?p=70
# 页面配置
// 引用插件
const HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
...
plugins: [
new HtmlWebpackPlugin({
template: './index.html',
inject: 'body',
chunks: [
'main',
'jquery',
],
filename: 'index.html'
}),
new HtmlWebpackPlugin({
template: './page.html',
inject: 'body',
chunks: [
'main2',
'jquery',
],
filename: 'page/page.html'
})
]
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
视频教程：https://www.bilibili.com/video/BV1YU4y1g745?p=72
评论
- 表情
——暂无评论——