文件列表插件
希望生成一个文件描述打包出来的文件
在plugins
中新建FileListPlugin
class FileListPlugin {
constructor ({filename}) {
this.filename = filename
}
apply (compiler) {
// 文件已经准备好了 要进行发射
// emit
compiler.hooks.emit.tap('FileListPlugin', (compilation) => {
let assets = compilation.assets;
console.log(assets, 55);
let content = `## 文件名 资源大小\r\n`
// [ [bundls.js, {}], [index.html, {}]]
Object.entries(assets).forEach(([filename, stateObj]) => {
content += `- ${filename} ${stateObj.size()}\r\n`
})
// 资源对象
assets[this.filename] = {
source () {
return content;
},
size () {
return content.length
}
}
})
}
}
module.exports = FileListPlugin
let path = require('path')
let DonePlugin = require('./plugins/DonePlugins')
let AsyncPlugins = require('./plugins/AsyncPlugins')
let HtmlWebpackPlugin = require('html-webpack-plugin')
let FileListPlugin = require('./plugins/FileListPlugin')
module.exports = {
mode: 'development',
entry: './src/index.js',
output: {
filename: 'build.js',
path: path.resolve(__dirname, 'dist')
},
plugins: [
new DonePlugin(),
new AsyncPlugins(),
new HtmlWebpackPlugin({
template: './src/index.html',
filename: 'index.html'
}),
new FileListPlugin({
filename: 'list.md'
})
]
}
生成list.md