webpack 编译完成执行代码

接收一个项目，由于目录结构的问题，每次编译完成后就需要去修改编译后的 HTML 文件中引用的其它文件的路径。

所以想在编译完成后使用 node 来操作文件修改路径。

然后在 webpack 官网找到了 ProgressPlugin 插件，使用方法：

    new webpack.ProgressPlugin(function handler(percentage, msg) {
        if (percentage==0) {
            console.log('开始编译');
        }

        if (percentage==1) {
            console.log('结束编译');
            fs.readFile(DIST_PATH + '/index.html', 'utf-8', function(err, data) {
                if (err) {
                    throw new Error('读取编译译后的 HTML 文件失败...');
                }
                const newData = data.replace(/src\//g, '');
                fs.writeFile(DIST_PATH + '/index.html', newData, function(err) {
                    if (err) {
                        throw new Error('修改编译后的 HTML 文件失败...');
                    }
                });
            });
        }
    })

编译过程中 percentage 会从0变到1，编程1的时候执行自己的代码就行。

转载于:https://www.cnblogs.com/3body/p/6178464.html