创建一个webapck插件，在chunk文件中查询关键字
1、创建一个webpackPlugin.js文件
webpackPlugin.js
2、添加以下代码
let colors = require('colors')//导入颜色插件
class WebpackPlugin {
constructor(doneCallback, emitCallback) {
this.emitCallback = emitCallback
this.doneCallback = doneCallback
}
apply(compiler) {
compiler.hooks.shouldEmit.tap('WebpackPlugin', (compilation) => {
Object.keys(compilation.assets).forEach((data) => {
let content = compilation.assets[data].source();
//判断chunk文件中是否有关键字
if (content.indexOf('奥迪') != -1) {
//出现
console.log(`\n\n`);
console.log(colors.red.bold('出现关键字“奥迪”，文件在', data))
console.log(`\n`);
throw new Error()
}
})
this.emitCallback();
})
compiler.hooks.emit.tap('WebpackPlugin', (err) => {
// 在done事件中回调doneCallback
this.doneCallback();
})
}
}
module.exports = WebpackPlugin
3、使用插件
1.在webpack.prod.conf中导入包
const WebpackPlugin = require('./WebpackPlugin')
2、在plugins中使用
new CheckKeyWebpackPlugin(() => {
//webpack 模块完成转换
console.log('emit 事件发生了，所有模块的转换和代码块对应的文件已经生成好了～')
}, () => {
//webpack构建成功，并且文件输出了后会执行到这里，在这里可以做发布文件操作
console.log('done 事件发生了，成功构建完成！')
})
4、npm run build看效果
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。