Node.js项目中如何安装和使用ESLint

node.js项目中如何安装和使用eslint?本篇文章给大家介绍一下在 node.js 应用程序中使用 eslint的方法。

Node.js项目中如何安装和使用ESLint

【推荐学习:《nodejs 教程》】

ESLint 是一个开源 JavaScript linting 实用程序,它可以帮助我们规范代码,克服开发人员的一些意想不到错误,因为 JavaScript 是弱类型的语言。

Javascript 社区中有很多规范化选项,比如 JSHint 和 JSCS,用于代码 linting,包括今天我们要讲的 ESLint。

ESLint 旨在使所有规则完全可插入。这是它产生的主要原因之一。它允许开发人员创建自己的 linting 规则。ESLint 官方指南中提供的每个规则都是独立的规则,开发人员可以在任何时候决定是否使用特定的规则。

安装

对于项目目录的本地安装:

$ npm i eslint -D

登录后复制

对于工作系统中的全局安装:

$ npm i eslint -g

登录后复制

安装好后,我们就可以通过终端中的 eslint 命令使用 ESLint。

配置

最简单的配置方法是设置一个 .eslintrc JSON 文件,其中可以描述所有的 linting 规则。

.eslintrc 的一个示例:

{  "env": {    "node": true,    "browser": true  },  "globals": {    "exampleGlobalVariable": true  },  "rules": {    "no-console": 0,    "space-infix-ops": "error",    "quotes": ["error", "single", {      "avoidEscape": true,      "allowTemplateLiterals": true    }],    "space-before-blocks": ["error", "always"],    "semi": ["error", "never"]  },  "plugins": []}

登录后复制

主要字段:

parse — 指定解析器parserOptions — 指定解析器选项env — 指定脚本的运行环境root — 为 true 时,停止向上查找父级目录中的配置文件globals — 脚本在执行期间访问的额外的全局变量rules — 在此处添加您的自定义规则

如果全局安装了 eslint,我们还可以使用以下命令生成配置文件:

$ eslint --init

登录后复制

在其他情况下,如果您已在本地将其安装到项目中,则需要在终端中输入:

$ ./node_modules/.bin/eslint --init

登录后复制

在这两种情况下,都会提示您生成 .eslintrc 文件的一组基本规则。

1.png

上述提示后生成的文件示例:

{  "env": {    "browser": true,    "commonjs": true,    "es2021": true  },  "extends": "eslint:recommended",  "parserOptions": {    "ecmaVersion": 12  },  "rules": {    "indent": [      "error",      "tab"    ],    "linebreak-style": [      "error",      "windows"    ],    "quotes": [      "error",      "single"    ],    "semi": [      "error",      "never"    ]  }}

登录后复制

有关配置的详细信息,请阅读:http://eslint.org/docs/user-guide/configuring

为了方便运行,我们可以在项目的 package.json,在 scripts 字段里面添加以下脚本:

{  "scripts" : {    "lint": "eslint **/*.js",    "lint-html": "eslint **/*.js -f html -o ./reports/lint-results.html",    "lint-fix": "eslint --fix **/*.js"  }}

登录后复制

我们将该规则应用于以下文件:

var a = 1;console.log(1);

登录后复制

执行 npm run lint 后将出现以下信息:

2.png

ESLint 提示已经很明显了:3 个错误。第一行和第二行的最后又额外的分号错误,a 被赋值但从未使用。

并且提示使用 –fix 选项修复错误和警告,有 2 个错误是可以修复的。现在,使用 npm run lint-fix 修复它,a 的去留就看自己手动更改。

你还可以运行 npm run lint-html 命令,将检查结果写入一个网页文件。

3.png

配置文件优先级

如果您按上面的步骤一步步来,你会可能已经知道,ESLint 支持几种格式的配置文件。

现在存在一个问题,如果同个目录下有多个 ESLint 文件,它们会如何执行,优先级如何?

ESLint 源码中给出了我们答案,其优先级配置如下:

const configFilenames = [  ".eslintrc.js",  ".eslintrc.yaml",  ".eslintrc.yml",  ".eslintrc.json",  ".eslintrc",  "package.json"]

登录后复制

.eslintrc.js > .eslintrc.yaml > .eslintrc.yml > .eslintrc.json > .eslintrc > package.json

规则

ESLint 中的规则是单独添加的。默认情况下不强制执行任何规则。您必须明确指定规则,然后才会为 linting 过程启用它。

打开官方文档查找完整的规则列表:

http://eslint.org/docs/rules/

在决定要包含哪些规则之后,您必须设置这些错误级别。每个错误级别可定义如下:

0 — 关闭规则,相当于 off1 — 打开规则作为警告,相当于 warn2 — 打开规则作为错误,相当于 error

错误和警告之间的区别在于 eslint 完成时将具有的退出代码。如果发现任何错误,eslint 将以 1 退出代码退出,否则将以 0 退出。

如果您在生成步骤中进行 lint,这允许您控制哪些规则应破坏您的生成,哪些规则应视为警告。

环境

您正在编写的代码可能适用于特定环境,例如,您可能正在使用 Express 框架在 Node.js 应用程序中编写 REST API,并且该应用程序的前端将在 Vue/React 中构建。

两个不同的项目、两个不同的环境,它们都可以在一个文件中具有单独的 eslint 配置,即使客户端和服务器位于一个被视为项目根目录的项目目录下。

它是如何完成的?

通过在 .eslintrc 的 “env” 部分将环境 id 设置为 true。

ESLint CLI

ESLint 附带一个命令行界面(CLI),用于 lint 文件或目录。

$ eslint index.js

登录后复制

前面示例中我们已经看到,运行命令后生成的输出将按文件分组,并将指定 line:column 警告/错误、错误原因以及每个故障的规则名称。

将 ESLint 与您喜欢的编码风格结合使用

ESLint 个人并不提倡任何编码风格。您可以设置 .eslintrc 文件以使用您喜欢的样式规则强制编码样式。

您还可以将 ESLint 与样式指南(如 Airbnb、JavaScript 标准风格)一起使用。

你还必须使用额外的插件,例如:

Airbnb 的插件 eslint-config-airbnb-base。JavaScript 标准风格 eslint-config-standard一些流行库的插件:Vue | React

团队规范

AlloyTeam 给出的 React/Vue/TypeScript 项目的渐进式 ESLint 配置(eslint-config-alloy),以下贴出 React 的一小部分配置:

module.exports = {  parserOptions: {    babelOptions: {      presets: ['@babel/preset-react'],    },  },  plugins: ['react'],  rules: {    /**     * 布尔值类型的 propTypes 的 name 必须为 is 或 has 开头     * @reason 类型相关的约束交给 TypeScript     */    'react/boolean-prop-naming': 'off',    /**     * 

登录后复制

您可以参考该团队的一些配置,应用到自己的项目中。

更多编程相关知识,请访问:编程入门!!

以上就是Node.js项目中如何安装和使用ESLint的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2634079.html

(0)
上一篇 2025年3月7日 04:28:35
下一篇 2025年3月1日 14:57:59

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • Node.js中什么是非阻塞I/O?通过示例来理解!

    node.js中什么是非阻塞i/o?本篇文章通过例子带大家了解一下node.js中的是非阻塞i/o,希望对大家有所帮助! 写在最前老早就想学Node.js了,觉得前端一定要是懂服务端知识,并且可以自己独立完成一个小型全栈项目的,但是碍于时间…

    2025年3月7日
    200
  • 浅析Node.js包管理工具 npm 和 yarn 的用法

    本篇文章带大家了解一下node.js包管理工具 npm 和 yarn 的使用方法,带大家快速入门npm 和 yarn。 本文学习 node.js 的包管理工具 npm& yarn 的使用。【推荐学习:《nodejs 教程》】 使用 …

    2025年3月7日
    200
  • 浅谈Node.js中的流,聊聊读取文件的三种方式

    本篇文章带大家简单了解一下node.js中的流,介绍一下读取文件的三种方式:异步读取文件、同步读取文件和流的方式读取文件。 学习 Node.js 的一些基础 1.fs 模块 内置模块 npm i    第三方模块 登录后复制 自己写的 自定…

    2025年3月7日
    200
  • 浅谈Node.js中的path模块和常用方法

    本篇文章带大家了解一下node.js中的 path 模块,介绍一下 path 模块的用法,以及常用的 path 方法。 Node.js path 模块是一个内置模块,可帮助您以独立于操作系统的方式使用文件系统路径。如果要构建支持 OSX、L…

    2025年3月7日
    200
  • Node.js中如何利用node-cron来调度任务?

    没有一个开发人员愿意把所有时间都花在繁琐的任务上,比如系统维护和管理、日常数据库备份以及定期下载文件和电子邮件。你更愿意专注于富有成效的工作,而不是跟踪这些烦人的琐事何时需要完成。【推荐学习:《nodejs 教程》】 这时就需要使用到任务调…

    2025年3月7日
    200
  • 深入了解Node.js中的4种 stream

    本篇文章带大家了解一下node.js中的4种 stream,看看怎么解决爆缓冲区的“背压”问题,有需要的朋友可以去学习了解一下~ 把一个东西从 A 搬到 B 该怎么搬呢? 抬起来,移动到目的地,放下不就行了么。 那如果这个东西有一吨重呢? …

    2025年3月7日 编程技术
    200
  • 聊聊Node.js Buffer中的encoding(编码)

    本篇文章带大家了解一下node.js buffer中的encoding,希望对大家有所帮助! 计算机最小的单位是一个位,也就是 0 和 1,在硬件上通过高低电平来对应。但是只有一位表示的信息太少了,所以又规定了 8 个位为一个字节,之后数字…

    2025年3月7日
    200
  • nodejs是做什么的

    nodejs是能够在服务器端运行JavaScript的开放源代码、跨平台运行环境;Node.js采用Google开发的V8运行代码,使用事件驱动、非阻塞和异步输入输出模型等技术来提高性能,可优化应用程序的传输量和规模。 本文操作环境:win…

    2025年3月7日
    200
  • 浅析Node.js api的 POSIX 标准

    posix 是什么?有哪些内容?下面本篇文章带大家了解一下node.js api的 posix 标准、node.js api的特点,希望对大家有所帮助! 【推荐学习:《nodejs 教程》】 如果你用过 Node.js 的 api,会不会觉…

    2025年3月7日
    200
  • 聊聊利用Node.js 的多线程能力怎么做异步计算

    怎么做异步计算?下面本篇文章给大家介绍一下利用浏览器和 node.js 的多线程能力做异步计算的方法,希望对大家有所帮助! 都说 Node.js 可以实现高性能的服务器,那什么是高性能呢? 所有的软件代码最终都是通过 CPU 来跑的,能不能…

    2025年3月7日
    200

发表回复

登录后才能评论