Appearance
开发者指南
¥Developer Guide
欢迎贡献。
¥Contributing is welcome.
🐛 错误报告
如果你认为你在 ESLint 中发现了错误,请在 创建新问题 或 GitHub 上提出拉取请求。
¥If you think you’ve found a bug in ESLint, please create a new issue or a pull request on GitHub.
请尽可能详细地说明,以帮助我们正确解决你的问题。如果我们需要对问题进行分类并不断要求人们提供更多详细信息,那么就会浪费实际解决问题的时间。通过在你的问题中包含大量细节来帮助我们尽可能提高效率。
¥Please include as much detail as possible to help us properly address your issue. If we need to triage issues and constantly ask people for more detail, that’s time taken away from actually fixing issues. Help us be as efficient as possible by including a lot of detail in your issues.
✨提出新规则或规则变更
¥✨ Proposing a new rule or a rule change
为了添加新规则或更改规则,你应该:
¥In order to add a new rule or a rule change, you should:
在 GitHub 上创建问题并描述拟议规则
¥Create issue on GitHub with description of proposed rule
使用
npm run new <rule name> <author name>
命令生成新规则¥Generate a new rule using the
npm run new <rule name> <author name>
command编写测试场景并实现逻辑
¥Write test scenarios & implement logic
在生成的
docs
文件中描述规则¥Describe the rule in the generated
docs
file确保所有测试都通过
¥Make sure all tests are passing
运行
npm run lint
并修复任何错误¥Run
npm run lint
and fix any errors运行
npm run update
以更新自述文件和推荐配置¥Run
npm run update
in order to update readme and recommended configuration创建 PR 并在描述中链接创建的问题
¥Create PR and link created issue in description
我们非常高兴看到潜在的贡献,所以不要犹豫。如果你有任何建议、想法或问题,请随时添加新的 issue,但首先请确保你的问题不会重复之前的问题。
¥We're more than happy to see potential contributions, so don't hesitate. If you have any suggestions, ideas or problems feel free to add new issue, but first please make sure your question does not repeat previous ones.
🔥使用规则
¥🔥 Working with rules
在开始编写新规则之前,请阅读 官方 ESLint 指南。
¥Before you start writing new rule, please read the official ESLint guide.
接下来,为了了解你要检查的代码的 AST 是什么样子,请使用 astexplorer.net。astexplorer.net 是检查 AST 的绝佳工具,也支持 Vue 模板。
¥Next, in order to get an idea how does the AST of the code that you want to check looks like, use the astexplorer.net. The astexplorer.net is a great tool to inspect ASTs, also Vue templates are supported.
打开 astexplorer.net 后,选择 Vue
作为语法,选择 vue-eslint-parser
作为解析器。
¥After opening astexplorer.net, select Vue
as the syntax and vue-eslint-parser
as the parser.
由于 Vue 中的单文件组件不是纯 JavaScript,我们不能使用默认解析器,因此我们不得不引入额外的解析器:vue-eslint-parser
,生成增强的 AST,其中的节点代表模板语法的特定部分,以及 <script>
标签内的内容。
¥Since single file components in Vue are not plain JavaScript, we can't use the default parser, and we had to introduce additional one: vue-eslint-parser
, that generates enhanced AST with nodes that represent specific parts of the template syntax, as well as what's inside the <script>
tag.
要了解有关生成的 AST 中某些节点的更多信息,请访问此处:
¥To know more about certain nodes in produced ASTs, go here:
vue-eslint-parser
提供了一些有用的解析器服务,以帮助遍历生成的 AST 和访问模板的令牌:
¥The vue-eslint-parser
provides few useful parser services, to help traverse the produced AST and access tokens of the template:
context.parserServices.defineTemplateBodyVisitor(visitor, scriptVisitor)
context.parserServices.getTemplateBodyTokenStore()
查看 示例规则 以更好地了解它们的工作原理。
¥Check out an example rule to get a better understanding of how these work.
请注意,关于你将在测试中编写什么样的代码示例,你必须在 RuleTester
中相应地设置解析器(但你可以根据每个测试用例进行设置)。查看此处的示例
¥Please be aware that regarding what kind of code examples you'll write in tests, you'll have to accordingly setup the parser in RuleTester
(you can do it on per test case basis though). See an example here
如果你遇到困难,请记住,你已经可以从中学习了很多规则,如果你找不到正确的解决方案 - 如有问题,请随时与我们联系。我们很乐意提供帮助!
¥If you'll stuck, remember there are plenty of rules you can learn from already, and if you can't find the right solution - don't hesitate to reach out in issues. We're happy to help!
:white_check_mark:使用 TypeScript 进行 JSDoc 类型检查
¥:white_check_mark: JSDoc type checking with TypeScript
我们已通过 TypeScript 和 JSDoc 启用类型检查。执行类型检查的命令是:npm run tsc
¥We have type checking enabled via TypeScript and JSDoc.\ The command to perform type checking is: npm run tsc
这只是为了帮助你编写规则,而不是进行严格的类型检查。如果你发现很难解决类型检查警告,请随意使用 // @ts-nocheck
和 // @ts-ignore
注释来抑制警告。
¥This is just to help you write the rules, not to do strict type checking. If you find it difficult to resolve type checking warnings, feel free to suppress warnings using the // @ts-nocheck
and // @ts-ignore
comment.