插件 index.js:
const pluginName = 'myTestPlugin';
class myTestPlugin {
apply(compiler) {
compiler.hooks.emit.tapAsync(pluginName, (compilation, cb) => {
//可遍历出所有的资源名
for (var filename in compilation.assets) {
//console.log('name==', filename)
}
compilation.chunks.forEach(function (chunk) {
chunk.files.forEach(function (filename) {
// compilation.assets 存放当前所有即将输出的资源
// 调用一个输出资源的 source() 方法能获取到输出资源的内容
let source = compilation.assets[filename].source();
source = '/*这是我通过webpack plugin 插八的一行代码*/\n' + source
compilation.assets[filename] = {
source: function () {
return source
},
size: function () {
return source.length
}
}
});
})
cb()
});
compiler.hooks.done.tap(pluginName, (compilation) => {
console.log('webpack 构建完毕!');
});
}
}
module.exports = myTestPlugin;
webpack.config.js
//引入webpack插件
const myTestPlugin = require('./webPackPlugin/index.js')
//在plugin中创建插件实例
module.exports = {
...
plugins:[
new myTestPlugin()
]
}