[英]Angular Eslint config is not extending Project Eslint config
我有一个 angular 12.x 项目,它使用 eslint,这是当前的根配置文件:
{
"env": {
"browser": true,
"node": true
},
"parser": "@typescript-eslint/parser",
"parserOptions": {
"project": "./tsconfig.base.json",
"sourceType": "module"
},
"plugins": [
"eslint-plugin-import",
"@angular-eslint/eslint-plugin",
"@angular-eslint/eslint-plugin-template",
"@typescript-eslint"
],
"extends": ["prettier", "eslint:recommended"],
"rules":{... lots of rules}
}
我有一个库(使用 NX 创建)是可重用的组件,让我在此示例中使用 MyComponent。 该组件有自己的 eslintrc,它扩展了根目录,在其内容下方:
{
"extends": ["../../../.eslintrc.json"], //path to the root eslintrc
"ignorePatterns": ["!**/*"],
"overrides": [
{
"files": ["*.ts"],
"extends": [
"plugin:@nrwl/nx/angular",
"plugin:@angular-eslint/template/process-inline-templates"
],
"rules": {
"@angular-eslint/directive-selector": [
"error",
{
"type": "attribute",
"prefix": "suppressed",
"style": "camelCase"
}
],
"@angular-eslint/component-selector": [
"error",
{
"type": "element",
"prefix": "suppressed",
"style": "kebab-case"
}
]
}
},
{
"files": ["*.html"],
"extends": ["plugin:@nrwl/nx/angular-template"],
"rules": {}
}
]
}
这是使用上述 eslintrc 的MyComponent
:
export class MyComponent implements OnInit, OnDestroy {
constructor() {}
ngOnInit(): void {}
@Dispatch()
clearState() {
return new ViewActions.ClearState();
}
private functio() {
return null;
}
static handle() {}
ngOnDestroy(): void {
this.clearState();
}
}
根据我链接的文档中规则的默认配置,由于违反了规则,上面的代码应该有从@Dispatch()
开始一直到destroy()
的错误。
现在,如果我按照文档将规则配置添加到我的组件 eslintrc.json 中,它将按预期工作,即:方法clearState
将有错误,因为它已被注释,并且预计会出现在未注释之前方法,在这个ngOnInit
和私有的错误也是如此。
实际问题是我的组件 eslintrc.json 的第一行extends
针对根 eslintrc,我希望在该文件上覆盖我的所有规则。 如果我将成员排序更改为根 eslintrc,规则将停止工作,并恢复为添加的图像的错误。
此外,当从我的组件目录运行npx eslint --print-config .\\my-component.ts
,我得到以下用于成员排序的配置:
"@typescript-eslint/member-ordering": [
"error",
{
"default": [
"static-field",
"instance-field",
"static-method",
"instance-method"
]
}
],
我真的不知道这是从哪里来的。
有谁知道为什么我的组件 eslint 没有从根 eslintrc 扩展规则?
======更新==========
package.json 上的 Eslint 相关依赖
"@angular-eslint/eslint-plugin": "1.1.0",
"@angular-eslint/eslint-plugin-template": "1.1.0",
"@angular-eslint/template-parser": "12.3.0",
"@nrwl/eslint-plugin-nx": "12.9.0",
"@typescript-eslint/eslint-plugin": "4.28.5",
"@typescript-eslint/eslint-plugin-tslint": "4.12.0",
"@typescript-eslint/parser": "4.28.5",
"eslint": "7.32.0",
"eslint-config-prettier": "8.1.0",
"eslint-plugin-cypress": "2.10.3",
"eslint-plugin-import": "2.24.0",
"@angular-eslint/schematics": "12.3.1",
可能这有帮助。 我认为您通常应该在项目中使用"root": true 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.