-
Notifications
You must be signed in to change notification settings - Fork 4
Expand file tree
/
Copy pathwebpack.config.js
More file actions
136 lines (132 loc) · 3.53 KB
/
Copy pathwebpack.config.js
File metadata and controls
136 lines (132 loc) · 3.53 KB
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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
const fs = require('fs');
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
// 模块映射到输出 bundle 的过程
const ManifestPlugin = require('webpack-manifest-plugin');
// 打包地址
const buildPath = path.resolve(__dirname, './dist');
// 模板地址
const templateRoot = path.resolve(__dirname, './page');
// NODEJS FS 删除文件
let emptyDir = function (fileUrl) {
let files = fs.readdirSync(fileUrl); //读取该文件夹
files.forEach(function (file) {
let stats = fs.statSync(fileUrl + '/' + file);
if (stats.isDirectory()) {
emptyDir(fileUrl + '/' + file);
} else {
fs.unlinkSync(fileUrl + '/' + file);
console.log("删除文件 " + fileUrl + ' ````' + file + "```` 成功");
}
});
};
// 页面入口
const pageEntry = {};
// 页面模板
const pageHtml = [];
// 导航JSON
const navigation = {
"navList": []
};
// 检查是否有打包目录
!fs.existsSync(buildPath) && fs.mkdirSync(buildPath);
// 读取文件目录
const pages = fs.readdirSync(templateRoot)
pages.forEach((name, index) => {
// 页面入口配置
const enterPath = path.join(templateRoot, name)
pageEntry[name] = path.join(enterPath, 'entry.js')
// 输出页面模板
pageHtml.push(new HtmlWebpackPlugin({
entryName: name,
filename: `${name}.html`,
template: `${enterPath}/index.html`,
inject: false,
minify: {
removeComments: true,
collapseWhitespace: true
},
chunks: ['main', 'common', name]
}))
// 输出导航JSON
navigation.navList.push({
"name": name,
"href": `/${name}.html`
})
fs.writeFileSync(path.resolve(__dirname, './Navigation.json'), JSON.stringify(navigation));
})
module.exports = env => {
const config = {publicPath: '/'}
emptyDir(buildPath)
if (env.NODE_ENV === 'build') {
config.publicPath = './'
}
return {
entry: Object.assign(pageEntry, {
main: './public/main.js'
}),
// devtool: false,
devtool: 'source-map',
devServer: {
contentBase: path.resolve(__dirname, './'),
compress: true,
inline: true,
hot: true, // 模块热替换
port: 9000,
},
plugins: [
new ManifestPlugin(),
new webpack.HotModuleReplacementPlugin(), // 模块热替换
new webpack.optimize.CommonsChunkPlugin({ // 公共模块提取
name: 'common'
}),
// 清理 项目之外无法清理 用nodejs清理文件
// new CleanWebpackPlugin(buildPath),
].concat(pageHtml),
output: {
filename: 'js/[name]-[hash].bundle.js',
path: buildPath,
publicPath: config.publicPath
},
module: {
rules: [
{
test: /\.css$/,
use: [
'style-loader',
'css-loader',
'postcss-loader',
]
}, {
test: /\.(png|jpg|gif)$/,
use: [
{
loader: 'url-loader',
options: {
limit: 1,
outputPath: 'images/',
name: '[path]/[name]-[hash].[ext]'
}
}
]
}, {
test: /\.(woff|woff2|eot|ttf|otf)$/,
use: ['file-loader']
},
{
test: /\.js$/,
use: {
loader: 'babel-loader',
options: {
presets: ['latest']
}
},
exclude: '/node_modules/',
include: '/src/',
}
]
}
}
}