如何在Create React App中删除死代码

Question

我有一个create-react-app项目,我正在努力减少捆绑的JS文件大小.我的捆绑包大小的大约一半来自名为MDBReact(反应组件库)的依赖项,其中大部分未被使用.我试图找出如何/如果我可以从捆绑的构建中移除树抖动的死代码.我一直在研究这个问题,我发现的最接近的文章就是这个.这篇文章让我感到困惑,并没有给出如何或是否可以做到的任何解释.我还在webpack树上发现了这个指南,说明如何完成它,但这似乎并没有解决问题.

Answer 1

CRA 使用 webpack 来捆绑代码。Webpack 默认只能对 es 模块进行 Treeshake，而使用插件时只能对 commonjs 模块进行 Treeshake。

为了帮助您，您目前如何从 MDBReact 导入？

看起来 MDBReact 不是用 es 模块编写的，因此如果您使用以下 import 语句，webpack 将很难进行树摇晃：

import { module } from 'MDBReact';

相反，您可以尝试使用以下命令导入

import modules from 'MDBReact/module';

您可能必须根据 MDBReact 的结构更改模块的路径。查看 node_modules 文件夹即可找到答案。