如何检测 Angular 中的死代码或未使用代码？

Posted 2023-03-13

【中文标题】如何检测 Angular 中的死代码或未使用代码？

【英文标题】：How to detect dead or unused code in Angular?

【发布时间】：2019-04-14 07:21:35

【问题描述】：

我和我的团队正在开发一个 angular 应用程序已有一年多的时间了。作为我们代码重构过程的一部分，我们希望从我们的存储库中删除未使用或死代码。

是否有任何技术或工具可以自动从我们的 repo 中检测到这些未使用的代码，这对我们会有所帮助，而不是浪费大量时间和精力手动检测它们？ p>

【问题讨论】：

这能回答你的问题吗？ Detect unused methods - Visual Studio Code

【参考方案1】：

对于 VS Code，您可以使用：https://eslint.org/docs/rules/no-unused-vars What it does：在代码的任何地方声明但未使用的变量很可能是由于重构不完整而导致的错误。此类变量占用代码空间，可能导致读者混淆。

没有什么可以为您删除代码，但我认为这是一个很好的扩展。

如果你使用 sublime 什么都没有，因为它只是一个文本编辑器

【讨论】：

感谢 Jacopo 但我已经在整个开发过程中使用了这个 VS Code 扩展。我要检测的是任何未调用的方法，从未渲染过的 html 模板或从未使用过的 css 类。

我正在使用“Jetbrains Webstorm”来解决上述问题。下载链接：jetbrains.com/webstorm/download

【参考方案2】：

我发现这种在捆绑时删除未使用代码的方法并不完全是您和我正在寻找的，但它可能会有所帮助

Tree Shaking 是 RollupJS 最先引入的一种算法，也是 由 Webpack 2 实现，在捆绑时删除任何未使用的代码 你的代码。它依赖于 ES2015 模块来实现这一点。

https://alexjover.com/blog/tree-shaking-with-webpack-2-typescript-and-babel/

【参考方案3】：

这很简单。如果您使用 " ng serve --aot " cli 命令而不是 " ng serve " 运行您的应用程序，它会向您显示这些死代码的孔号（例如当您离开 " ng build --prod " 命令时）。