标签：同步 run turn str div spec 清空 ati tor
当我们在做打包的时候，在某一些具体时刻，（如打包结束时生成一个html,使用HtmlWebpackPlugin；在打包之前，把dist目录清空，使用CleanWebpackPlugin）帮我们做一些事情。
1.初始化一个项目
2.新建plugins文件夹，下面新建copyright-webpack-plugin.js（plugin）:
class CopyrightWebpackPlugin{ constructor(){ // 构造方法 console.log(‘插件被使用了‘); } apply(compiler){ // 调这个插件时会执行apply方法，complier--webpack实例 } } module.exports=CopyrightWebpackPlugin;
3.webpack.config.js:
plugins:[
new CopyrightWebpackPlugin()
]
4.进行打包，会发现输出--插件被使用了，说明我们的插件已经构造起来了
5.插件里面可以传递一些参数：
plugins:[ new CopyrightWebpackPlugin({ name:‘hello world‘ }) ]
6.得到参数：
constructor(options){ console.log(options); } // 命令行会输出{name:‘hello world‘}
apply(compiler){ // compiler存放着配置的所有内容，包括打包的所有相关内容 // compilation存放的是跟这次打包相关的内容 compiler.hooks.emit.tapAsync(‘CopyrightWebpackPlugin‘,(compilation,cb)=>{ console.log(123123); cb(); }) }
执行打包命令我们会发现输出了 123123
compilation里面有个属性assets包含了打包生成的所有内容，所以我们的需求就可以在这里面做文章：
compiler.hooks.emit.tapAsync(‘CopyrightWebpackPlugin‘,(compilation,cb)=>{ compilation.assets[‘copyright.txt‘]={ source:function(){ return ‘copyright by jin goly‘ }, size:function(){ return 21 } } cb(); })
compiler.hooks.compile.tap(‘CopyrightWebpackPlugin‘,compilation=>{ console.log(‘hello world‘); });
8.使用node调试工具：
在package.json中增加一个命令:
compiler.hooks.emit.tapAsync(‘CopyrightWebpackPlugin‘,(compilation,cb)=>{ debugger; compilation.assets[‘copyright.txt‘]={ source:function(){ return ‘copyright by jin goly‘ }, size:function(){ return 21 } } cb(); })
标签：同步 run turn str div spec 清空 ati tor
原文地址：https://www.cnblogs.com/jingouli/p/12336272.html
