「 JavaScript幸福风格的linter 」
翻译的原文 | 与日期 | 最新更新 | 更多 |
---|---|---|---|
commit | ⏰ 2018 9.3 | 中文翻译 |
欢迎 👏 勘误/校对/更新贡献 😊 具体贡献请看
If help, buy me coffee —— 营养跟不上了,给我来瓶营养快线吧! 💰
JavaScript幸福风格的linter
固有己见,但包含许多好东西的可配置ESLint包装器.强制执行严格且可读的代码.再也不要在Pull Request
上讨论代码样式了! 没有争论.没有.eslintrc
或.jshintrc
的管理.它只是工作!
下面会使用ESLint,所以有关规则的问题应该打开在eslint那里.
默认情况下支持JSX,但您需要eslint-config-xo-react用于React特定的linting.
- 美丽的输出.
- 零配置,但是可在需要时配置.
- 强制执行可读代码,因为您阅读的代码一定多于您编写的代码.
- 无需指定lint的文件路径,因为它会审计除常被忽略的路径之外的所有JS文件.
- 配置覆盖每个 文件/globs.
- 包括许多有用的ESLint插件,比如
unicorn
,import
,ava
,node
等更多. - 基于你的
package.json
的engines
自动启用. - 在运行之间缓存结果,以获得更好的性能.
- 将xo添加到项目中非常简单
$ xo --init
. - 自动修复许多问题
$ xo --fix
. - 使用编辑器打开错误的文件正确的行
$ xo --open
. - 指定喜欢的缩进和分号很容易,而不会搞乱规则配置.
- 可选择使用Prettier代码风格.
- 伟大的编辑器插件.
>> 拉开
$ npm install --global xo
$ xo --help
Usage
$ xo [<file|glob> ...]
Options
--init 将xo添加到项目中
--fix 自动修复问题
--reporter 记录使用
--env 环境预设 [可多次设置]
--global 全局变量 [可多次设置]
--ignore 要忽略的其他路径 [可以多次设置]
--space 使用空格缩进,而不是制表符 [默认值:2]
--no-semicolon 不使用分号
--prettier 符合更漂亮的代码风格
--node-version 要支持的Node.js版本范围
--plugin 包含第三方插件 [可多次设置]
--extend 使用自定义配置扩展默认值 [可以多次设置]
--open 在编辑器中打开包含问题的文件
--quiet 仅显示错误,不显示警告
--extension lint的附加扩展 [可多次设置]
--no-esnext 不执行 es2015+ 规则
--cwd=<dir> 文件的工作目录
--stdin 从stdin 验证/修复代码
--stdin-filename 为--stdin 选项指定文件名
Examples
$ xo
$ xo index.js
$ xo *.js !foo.js
$ xo --space
$ xo --env=node --env=mocha
$ xo --init --space
$ xo --plugin=react
$ xo --plugin=html --extension=html
$ echo 'const x=true' | xo --stdin --fix
Tips
Put options in package.json instead of using flags so other tools can read it.
请注意,使用全局CLI运行时,优先使用您本地安装的xo,即使在全局运行时也是如此.
任何这些都可以覆盖,如有必要.
建议的工作流程是: 在本地项目中添加xo,并使用测试运行它.
简单地运行$ xo --init
(使用任何选项)将xo添加到package.json
或创建一个.
{
"name": "awesome-package",
"scripts": {
"test": "ava"
},
"devDependencies": {
"ava": "^0.20.0"
}
}
{
"name": "awesome-package",
"scripts": {
"test": "xo && ava"
},
"devDependencies": {
"ava": "^0.20.0",
"xo": "^0.18.0"
}
}
然后运行吧$ npm test
,xo将在测试之前运行.
您可以通过将它放在package.json中来配置xo中的一些选项:
{
"name": "awesome-package",
"xo": {
"space": true
}
}
eslint -> 全局和eslint -> 规则可以在文件中内联配置.
name: | 环境变量 |
---|---|
类型: | Array |
默认: | ['node'] |
哪一个eslint -> 环境会在您的代码运行.
每个环境都带有一组预定义的全局变量.
类型: | Array |
---|---|
Desc: | 代码在执行期间访问的其他全局变量 |
类型: | Array |
---|---|
Desc: | 一些路径默认情况下会被忽略,包括路径.gitignore .可以在此处添加其他忽略. |
name: | 空格 |
---|---|
类型: | boolean ,number |
默认: | false (Tab缩进) |
将其设置为true
获得2空格缩进,或指定空格数.
出于实际原因,存在此选项,但我强烈建议您阅读"为什么tab更优越".
类型: | Object |
---|---|
Desc: | 覆盖任何一个默认规则 |
见ESLint文档有关每条规则的更多信息.
请花一点时间考虑,是否确定需要使用此选项.
name: | 分号 |
---|---|
类型: | boolean |
默认: | true (需要分号) |
将其设置为false
,强制执行无分号样式.
name: | prettier代码风格 |
---|---|
类型: | boolean |
默认: | false |
用Prettier格式化代码.
该Prettier的选项将从中Prettier的配置读取,而如果 没有设置 将被确定为:
- semi: 基于分号选项
- useTabs: 基于space选项
- tabWidth: 基于space选项
- trailingComma: 基于esnext
- singleQuote:
true
- bracketSpacing:
false
- jsxBracketSameLine:
false
如果为 Prettier和xo 设置了矛盾的选项,则会抛出错误.
name: | node版本 |
---|---|
类型: | string ,boolean |
默认值: | 在项目package.json 的engines.node 字段 |
启用特定于配置范围内的Node.js版本的规则.如果设置为false
,不会启用特定于Node.js版本的规则.
类型: | Array |
---|---|
Desc: | 包括第三方插件. |
类型: | Array ,string |
---|---|
Desc: | 使用一个或多个可共享的配置要么插件配置覆盖任何默认规则(如上面的rules. |
类型: | Array |
---|---|
Desc: | 除.js 和.jsx 之外,还允许更多的扩展.确保它们受ESLint或ESLint插件的支持. |
类型: | Object |
---|---|
Desc: | 共享ESLint设置给到rules. |
例如,要配置import
插件,来使用您的webpack配置来确定搜索路径,你可以在这里加上{"import/resolver": "webpack"}
.
类型: | string |
---|---|
Desc: | ESLint解析器. |
例如,babel-eslint
如果您要使用ESLint尚不支持的语言功能.
name: | es下一代语法 |
---|---|
类型: | boolean |
默认: | true |
实施 es2015+ 规则.禁用此功能将不执行 es2015+ 语法和约定.
即使没有此选项,也会解析 es2015+ .您已经可以使用 es2017等功能了async
/await
.
看eslint-config-xo-typescript#使用-xo
xo可以轻松覆盖特定文件的配置.该overrides
属性必须是覆盖对象的数组.每个覆盖对象必须包含一个glob字符串的files
属性,或是一个glob字符串数组.其余属性与上述属性相同,并将覆盖基本配置的设置.
如果多个覆盖配置与同一个文件匹配,则每个匹配覆盖按其在数组中出现的顺序应用.这意味着数组中的最后一个覆盖,优先于先前的覆盖.请考虑以下示例:
{
"xo": {
"semicolon": false,
"space": 2,
"overrides": [
{
"files": "test/*.js",
"esnext": false,
"space": 3
},
{
"files": "test/foo.js",
"esnext": true
}
]
}
}
-
基本配置很简单
space: 2
,semicolon: false
.除非另有说明,否则这些设置用于每个文件. -
对于每个
test/*.js
文件,使用基本配置,但是space
被覆盖为3
,和esnext
选项设置为false
.生成的配置是:
{
"esnext": false,
"semicolon": false,
"space": 3
}
- 对于
test/foo.js
,首先应用基本配置,然后是第一个覆盖配置(它的glob模式也匹配test/foo.js
),最后应用第二个覆盖配置.生成的配置是:
{
"esnext": true,
"semicolon": false,
"space": 3
}
如果你有一个嵌套的目录结构package.json
文件,您希望跳过其中一个子清单,您可以通过设置"xo": false
.
例如,当你有单独的应用程序和electron-builder
中的开发package.json
文件.
放一个package.json
在你的根目录配置,和在您的捆绑包中添加"xo": false
到了package.json
.
如果项目中的某些文件,被转换为支持较旧的Node.js版本,则可以使用配置覆盖为这些文件设置特定nodeVersion
目标版本选项.
例如,如果您的项目以 Node.js 4 为目标(您的package.json
配置了engines.node
设置>=4
),而你正在使用AVA,然后自动转换您的测试文件.你可以覆盖测试文件的nodeVersion
:
{
"xo": {
"overrides": [
{
"files": "{test,tests,spec,__tests__}/**/*.js",
"nodeVersion": ">=9"
}
]
}
}
它的意思是拥抱与亲吻.
标准风格是一个非常酷的想法.我也希望我们可以有一种风格来统治它们! 但实际情况是,JS社区过于多样化,并且无法创造统一代码风格.他们也错误地推出自己的风格,而不是最受欢迎的风格.相比之下,xo更加务实,没有抱负单一样式.我使用xo的目的是,简单地接近无配置使用来实现一致的代码样式.xo默认带有我的代码样式首选项,因为我主要为自己制作,但一切都是可配置的.
xo基于ESLint.这个项目最初只是一个可共享的ESLint配置,但它很快就发展了.我想要更简单的东西.只是输入xo
就完成.没有争论.没有配置.我也有一些令人兴奋的未来计划.但是,在使用ESLint时,您仍然可以获得大部分ESLint可共享配置,来自xo优势.
- eslint-config-xo- 带有tab缩进的xo的ESLint可共享配置
- eslint-config-xospace- 具有2空格缩进的xo的ESLint可共享配置
- eslint-config-xo-react- 用于上述的React的ESLint可共享配置
- stylelint-config-xo- 带有tab缩进的xo的Stylelint可共享配置
- stylelint-config-xospace- 具有2空格缩进的xo的Stylelint可共享配置
- tslint-xo- xo的TSLint可共享配置
- eslint-config-xo-typescript- TypeScript的ESLint可共享配置
- eslint-config-xo-flow- Flow的ESLint可共享配置
- eslint-plugin-unicorn- 各种棒棒的ESLint规则 (捆绑在xo中)
- xo-summary- 显示
xo
样式的输出错误列表,按计数排序
[](https://github.com/xojs/xo)
![]() |
![]() |
![]() |
---|---|---|
Sindre Sorhus | 马里奥内布尔 | Pierre Vanduynslager |
MIT