怎么在项目中使用ESLint(eslint,开发技术)

时间:2024-05-02 16:47:07 作者 : 石家庄SEO 分类 : 开发技术
  • TAG :

    %E6%80%8E%E4%B9%88%E5%9C%A8%E9%A1%B9%E7%9B%AE%E4%B8%AD%E4%BD%BF%E7%94%A8ESLint

运行良好的项目具有清晰、一致的编码约定,并具有自动执行功能。当我审查一个项目时,它的代码看起来像一个孩子用斧头和房子的图片建造的房子,它并没有激发代码功能的信心。

没有编码约定也是吸引贡献的障碍。依赖于一个不欢迎贡献的项目本身就是一种风险。

除了检查样式之外,linter 也是查找某些类型错误(例如与变量范围相关的错误)的绝佳工具。分配给未声明的变量(这些会泄漏到全局范围,污染它并可能导致很难找到错误)和使用未定义的变量是在 lint 时可检测到的错误示例。

ESLint 是用于 linting Node.js 包的主要工具,可以配置为强制执行多种编码风格。可以定义自己的样式定义,但在这里我将展示如何使用 StrongLoop 样式。还有其他的,但是StrongLoop的风格平淡无奇(好东西,编码风格不应该引起注意),和很多开源Node.js项目中使用的类似。

安装并保存软件包依赖项:npm install --save-dev eslint eslint-config-strongloop.

通过运行设置 ESLint 以使用 StrongLoop 配置echo '{"extends": "strongloop"}' > .eslintrc.json

确保你有一个.gitignore文件(因此派生文件不会被 linted,只有原始源文件)。如果你没有,你可以用最少的努力创建一个:echo node_modules/ >> .gitignore.请注意,也可以使用特定于 ESLint 的.eslintignore文件,该文件与 .gitignore 具有相同的语法,并且可能具有相同的内容。为了避免这种维护负担,大多数项目只使用 .gitignore。

使用此设置,通过将 package.json 更改为pretest脚本,将 ESLint 配置为在测试之前自动运行。它应该类似于:

package.json 的确切内容取决于您的项目。你必须添加预测试脚本以使 ESLint 在你的单元测试之前运行。当你使用 npm 运行测试脚本时,它还会运行 pretest 和 posttest 脚本(如果存在)。我更喜欢这个,因为 eslint 通常比我的测试运行得快得多,而且 lint 错误很容易修复,但有些人更喜欢在 linter 之前运行整个测试套件,在这种情况下,使用 posttest。

提交 ESLint 自动化支持:

完成后,运行

如果你的控制台充斥着大量错误,请不要气馁!

人们避免使用 ESLint 的一个原因是清理从未被 lint 的代码感觉就像清理Augean 马厩。我建议像 Hercules 那样做:从工具中获取帮助。

ESLint 可以自动修复许多语法问题。这应该是你用来清理源代码的第一个工具:./node_modules/.bin/eslint --fix --ignore-path .gitignore .

如果你有 ESLint 预测试脚本,你还可以执行以下操作:npm run pretest -- --fix

有一些类的问题,ESLint不会解决,然而,在这种情况下,你可以用做一次性清理prettier。prettier 最常用作 ESLint 和 auto-formats 源在提交之前的替代品。它在引导 ESLint 时也非常有用。像这样运行它:

运行eslint --fixand 后prettier,你应该只有很少的剩余警告需要手动清理。虽然 prettier 不像 ESLint 那样常用,但如果需要,它可以用作 ESLint 的补充(prettier 用于自动格式化,ESLint 用于格式强制和错误检查)。如果由于某种原因您现在没有时间修复这些问题,请禁用 ESLint 规则。自动强制执行某些样式子集比完全不强制要好得多。您可以为特定项目覆盖一些 StrongLoop 样式,然后有时间回来清理代码。

这是放宽max-len规则以允许最多 120 个字符宽的连续行的示例:

你可能会发现你的代码使用了一致的风格,但不是 StrongLoop 的风格。如果接近,你可以自定义StrongLoop样式并发布为你自己的。如果你的风格完全不同,那么编写和发布你自己的可重用配置可能是有意义的。

一旦您的代码干净利落(使用 npm run pretest 检查),提交结果:

有两个级别的自动化:项目范围的策略和您自己的个人设置。

就项目范围的策略而言,因为 ESLint 被配置为与您的测试一起运行,所以没有什么可做的。除非你没有为你的项目自动运行测试,在这种情况下是时候开始了!

就我自己的个人设置而言,我更喜欢在我的每个提交上运行 ESLint,因此我引入的任何问题都在我的机器上被 CI 捕获之前捕获。我用一个 gitpre-commithook来做这个。

要进行设置,请使用示例钩子作为基础:

cp .git/hooks/pre-commit.sample .git/hooks/pre-commit

文件的最后几行将如下所示:

将其更改为如下所示:

就是这样,你现在是 eslint 的另一个用户。

本文:怎么在项目中使用ESLint的详细内容,希望对您有所帮助,信息来源于网络。
上一篇:怎么加速Selenium下一篇:

5 人围观 / 0 条评论 ↓快速评论↓

(必须)

(必须,保密)

阿狸1 阿狸2 阿狸3 阿狸4 阿狸5 阿狸6 阿狸7 阿狸8 阿狸9 阿狸10 阿狸11 阿狸12 阿狸13 阿狸14 阿狸15 阿狸16 阿狸17 阿狸18