Knip是什么?
Knip 是一个了不起的工具,旨在清理你的JavaScript和TypeScript项目。那么,清理是什么意思呢?如果你曾经在一个涉及多人或甚至只是你自己进行了一段时间的项目上工作过,你会发现未使用的代码和依赖项会随着时间的推移在代码库中积累。这也被称为技术债务。
什么是技术债务?
技术债务是团队中没有人愿意处理的混乱局面。哦,等等,这听起来有点模糊。这里有一个更好的例子:技术债务可能是摇摇欲坠的旧代码,可能需要重构,或者是未使用的代码、依赖项、配置文件等等。
一个非常实际的技术债务积累的例子:我们经常因为缺乏牵引力而从项目中移除功能,但我们忘记清理所有相关的代码。或者我们过于频繁地过度设计解决方案,这留下了许多未使用的抽象和辅助函数。
这在今天尤为重要,因为我们盲目地接受LLM对我们代码库所做的更改。由于大多数LLM都是在糟糕的代码上训练的,你永远不应该期望它们做更多的事情。这意味着更多的未使用和不相关的代码将被留下。
运行 Knip
好了,关于“这是什么,那是什么”的讨论到此为止,让我们看看我们实际上如何清理这个混乱。这就是Knip发挥作用的地方。当你在代码库上运行Knip时,它会给你一个漂亮的总结,告诉你哪些文件、组件、导出函数、常量等在你的代码库中当前未被使用。
这是你会意识到随着时间的推移有多少混乱已经积累起来而未被注意到的时刻。除非你坚持极其严格的代码标准和审查,否则这是几乎不可能避免的,因为人类的大脑只能跟踪这么多。
这是一个我在其中一个项目上运行Knip的总结示例:$ pnpx knip
Unused files (5) app/components/cart.tsx app/components/emoji-picker.tsx app/components/media-dropzone.tsx app/components/profile.tsx app/components/select-image-modal.tsx Unused dependencies (4) @axiomhq/pino package.json:32:6 @hono/zod-validator package.json:36:6 @opentelemetry/auto-instrumentations-node package.json:41:6 @tailwindcss/typography package.json:63:6 Unused exports (4) CreatePost function app/components/create-post.tsx:51:17 HappeningNowModal function app/components/happening-now.tsx:755:17 ShareButton function app/components/post.tsx:141:17 StickerPopover function app/components/post.tsx:193:17 TipPostPopoverItem function app/components/post.tsx:549:17 Unused exported enum members (5) GUARANTEED DistributionStrategy app/enums.ts:41:3 CATEGORY SanitySearchKeys app/enums.ts:67:3 SLUG SanitySearchKeys app/enums.ts:68:3 TITLE SanitySearchKeys app/enums.ts:69:3 STICKERS FocusCarouselResourceType app/types.ts:526:3
哇!我们只运行了一个命令,现在就能看到代码库中未被使用的所有内容。这太棒了!说实话,这是 Knip 最好的部分之一。它几乎不需要配置。以下是其文档中的一句话:Knip 有很好的默认设置,并且旨在实现“零配置”。
这可能很难相信,但我能够使用Knip删除12k+行代码,涉及100+个文件,否则我无法独自完成。
使用配置文件
但是由于每个项目都不同,你可能希望运行 Knip 的地方也会改变。你可能希望在代码库的一部分上运行它——这就是配置文件的作用。
这是来自文档的一个示例配置文件:knip.json
{ "$schema": "https://unpkg.com/knip@5/schema.json", "entry": ["src/index.ts", "scripts/{build,create}.js"], "project": ["src/**/*.ts", "scripts/**/*.js"] }
如你所见,你可以自定义 Knip 运行的位置、它检查的内容等。它还有许多其他配置选项,说实话,我不会涵盖所有选项。那会太复杂。但这些是最基本的配置,很可能会适用于大多数项目。
不管怎样,回到Knip给我们的总结上,我们能在这里做什么?首先,你可以直接去那些文件并手动删除所有建议的未使用的东西。但是等等,这听起来不是一个非常容易的任务,对吧?是的,因为不是。去每个文件并删除东西是非常困难的。
但不用担心,Knip 在这一点上也为我们提供了帮助。Knip 为我们提供了一个自动修复标志,它会自动为你删除建议的删除内容。你能相信这个工具是免费的吗?我不能,但事实就是这样。knip --fix --allow-remove-files
好吧,这听起来有点危险,对吧?让工具对我们代码库进行文件操作?是的,这确实应该听起来很危险,因为它确实很危险,但 git 这是做什么的?只要你检出到一个新的分支,你就可以随心所欲地操作代码库的副本。你只用担心如果你不使用 git,这在2025年我认为是不可能的。
下一步
太好了!我们已经完成了应该做的一切。现在我们只需要审查Knip所做的更改。但是,为什么我们需要审查呢? well,是为了确保我们没有意外移除任何正在使用的东西。总是双重检查是个好习惯,这样我们就不至于在周五晚上破坏生产环境。
我最喜欢的事情之一是,如果你使用TypeScript,你可以直接运行TypeScript类型检查器tsc --noEmit,它会告诉你如果你不小心移除了某些被使用的地方的代码。但如果它没有抱怨,那你就没有thing to worry about。合并那个PR吧。但如果你使用JavaScript,首先,很抱歉你不得不维护一个JS代码库;其次,你仍然可能能够使用一个代码检查器,所以应该没问题。
好的,本文就到这里。希望你有所收获。今天就在你的代码库上运行 Knip,以后你就会感谢自己。开心地删除代码吧。