首页
前端开发
Webpack
Post-Compile Webpack Plugin编译后插件

Post-Compile Webpack Plugin编译后插件

0 次浏览 0 条评论
zip
zip

Webpack 的编译后操作一直挺麻烦的，用Post-Compile Webpack Plugin能省不少事。Webpack 本身插件钩子多，但多人没注意过post-compile这个阶段，嗯，刚好用它能在文件写磁盘前做点定制活儿。

像静态资源版本更新挺实用，打完包自动生成哈希，浏览器老缓存问题直接搞定。还有自动化部署也不错，编译完顺手把文件丢到服务器，省得手动传，省心。

配置也简单，先npm install --save-dev post-compile-webpack-plugin，在webpack.config.js里挂到plugins就行：

const PostCompileWebpackPlugin = require('post-compile-webpack-plugin');


module.exports = {
  plugins: [
    new PostCompileWebpackPlugin({
      apply: (compiler) => {
        compiler.hooks.postCompile.tap('MyPostCompilePlugin', () => {
          console.log('Webpack 编译已完成');
          // 这里写你的活儿
        });
      },
    }),
  ],
};

哦，对了，自定义函数里别写太耗时的操作，不然编译慢得你自己都烦。如果要拿compiler对象干点别的活儿，记得多看下文档或者钩子生命周期，可以看看生命周期钩子，对理解 Webpack 也有点。

如果你想在Webpack打包后多做点事儿，试试这个插件，还挺顺手的。

zip 文件大小：23.48KB