0

我正在尝试获取在 treeshaking 后最终出现在我的构建中的文件列表。我使用条件编译常量从包中删除开发/调试代码,Webpack 在 treeshaking 方面做得很好,我在生成的构建中找不到任何开发代码。但是我想编写一些代码来检查一些开发文件是否错误地最终进入生产构建。

我已经尝试过NormalModuleReplacementPlugin,但 Webpack 仍然会加载导入,即使它们没有被使用,它必须分析所有源以确定它们中的任何一个是否是死代码。

我尝试将插件添加到emit阶段挂钩并浏览所有模块并检查资源,但我仍然在那里找到对我的开发代码文件的引用,即使它们最终没有出现在生成的构建中。

class DevImportsMonitorPlugin {
    apply(compiler) {
        compiler.hooks.emit.tapAsync('DevImportsMonitor', (compilation, callback) => {
            compilation.chunks.forEach(chunk => {
                // explore chunk
                chunk.getModules().forEach(module => {
                    // explore modules
                })
            });
            callback();
        });
    }
}

我在那里放了一个断点并探索了块和模块的上下文,但它仍然引用了开发/测试模块。

也许有一种方法可以确定从输出中删除了哪个模块?

4

1 回答 1

0

我昨天刚试过,很酷;https://www.excitoninteractive.com/articles/read/65/webpack4/step-by-step-bundle-analyzer-plugin

于 2019-10-16T18:24:52.103 回答