如何编写一个webpack的plugin

Plugin是在开始打某个时刻,帮助我们处理⼀些什么事情的机制;
利用compiler-hooks的一些生命周期来做一些事情;

官方文档有很清晰的说明
compiler-hooks
compilation-hooks

class CopyrightWebpackPlugin {
  constructor(options) {
    console.log(options);
  }
  apply(compiler) {
    // 同步钩子
    compiler.hooks.compile.tap("CopyrightWebpackPlugin", compilation => {
      console.log("执行了");
    });
    // 异步钩子
    compiler.hooks.emit.tapAsync(
      "CopyrightWebpackPlugin",
      (compilation, cb) => {
        compilation.assets["copyright.txt"] = {
          source: function() {
            return "hello plugin";
          },
          size: function() {
            return 20;
          }
        };
        cb();
      }
    );
  }
}

module.exports = CopyrightWebpackPlugin;

  1. 说明apply函数是必须有的
  2. compiler是打包整个过程的api对象
  3. compilation是单次构建的资源对象

你可能感兴趣的:(如何编写一个webpack的plugin)