73

我们正在重构一个遗留的 web 应用程序，结果是“杀死”了很多 JavaScript 代码，但我们害怕删除我们认为是死代码的东西，因为不确定。是否有任何工具/技术可以积极识别 JavaScript 中的死代码？

4

8 回答 8

11

无需寻找任何太复杂的东西：

于 2010-11-09T18:59:50.090 回答
8

有grep。使用它来查找函数调用。假设您有一个名为dostuff(). grep -r "dostuff()" * --color在项目的根目录上使用。除非您找到定义以外的任何内容，否则您可以安全地删除它。

ack也是grep的一个显着替代品。

于 2010-11-09T17:43:48.013 回答
8

您可以使用死文件库： https : //m-izadmehr.github.io/deadfile/

它可以在任何 JS 项目中简单地找到未使用的文件。

无需任何配置，它支持 ES6、JSX 和 Vue 文件： 在此处输入图像描述

于 2019-10-29T23:58:07.387 回答
7

JetBrains 的 WebStorm IDE 可以突出显示项目中的死代码和未使用的变量。

于 2013-08-13T12:57:20.673 回答
6

您可以将代码优化器用作Google Closure Compiler，但它通常用于最小化代码。

function hello(name) {
alert('Hello, ' + name);
}

function test(){
alert('hi');
}

hello('New user');

会导致

alert("Hello, New user");

例如。

您可以做的另一件事是使用 Chrome 的开发人员工具（或 Firebug）来查看所有函数调用。在配置文件下，您可以看到随着时间的推移调用了哪些函数，哪些没有。

DT 配置文件

于 2010-11-09T17:47:37.347 回答
5

Chrome 提供了新功能，可以让开发人员查看代码覆盖率，即执行了哪些代码行。

这当然不是一站式解决方案，但可以帮助开发人员获得代码洞察力。

检查此链接以获取详细信息

作为Chrome 59版本的一部分推出

工具

于 2017-07-07T10:12:21.010 回答
2

如果你想自动化这个，我会看看https://github.com/joelgriffith/navalia，它公开了一个自动化的 API 来做到这一点：

const { Chrome } = require('navalia');
const chrome = new Chrome();

chrome.goto('http://joelgriffith.net/', { coverage: true })
  .then(() => chrome.coverage('http://joelgriffith.net/main.bundle.js'))
  .then((stats) => console.log(stats)) // Prints { total: 45913, unused: 5572, 
  percentUnused: 0.12135996340905626 }
  .then(() => chrome.done());

更多信息：https ://joelgriffith.github.io/navalia/Chrome/coverage/

于 2017-07-09T02:53:02.580 回答
0

我讨厌这个问题，并且没有很好的工具来解决它，尽管 javascript 生态系统需要大量解析。正如另一个答案中提到的，死文件非常简洁，但我无法让它适用于我的代码库，它使用来自src目录的绝对导入。下面的 bash 足以了解是否有任何文件没有在任何地方导入（我找到了一些！），这很容易手动验证。

for f in $(find src -name '*.js' | grep -E 'src/(app|modules|components).*\.js$' | grep -v '.test.js'); do
  f=${f/src\//};
  f=${f/\/index.js/};
  f=${f/.js/};

  echo "$f imported in"$(grep -rl "$f" src | wc -l)" files"
done

我不关心测试/资源，因此 app|modules|components 位。字符串替换也可以显着清理，但希望这对某人有用。

于 2019-12-19T22:41:30.287 回答