I want to use eslint-plugin-rxjs-angular in my Angular v13 project. On their github page it says.
Configure the parser and the parserOptions for ESLint. Here, I use a .eslintrc.js file for the configuration:
And then, there is a snippet.
const { join } = require("path");
module.exports = {
parser: "@typescript-eslint/parser",
parserOptions: {
ecmaVersion: 2019,
project: join(__dirname, "./tsconfig.json"),
sourceType: "module"
},
plugins: ["rxjs-angular"],
extends: [],
rules: {
"rxjs-angular/prefer-async-pipe": "error"
}
};
How do I implement the .eslintrc.js configuration above, in my .eslintrc.json file, which I've added below?
{
"root": true,
"ignorePatterns": [
"projects/**/*"
],
"overrides": [
{
"files": [
"*.ts"
],
"parserOptions": {
"project": [
"tsconfig.json",
"e2e/tsconfig.json"
],
"createDefaultProgram": true
},
"extends": [
"plugin:@angular-eslint/recommended",
"plugin:@angular-eslint/template/process-inline-templates"
],
"rules": {
"@angular-eslint/component-selector": [
"error",
{
"prefix": "app",
"style": "kebab-case",
"type": "element"
}
],
"@angular-eslint/directive-selector": [
"error",
{
"prefix": "app",
"style": "camelCase",
"type": "attribute"
}
]
}
},
{
"files": [
"*.html"
],
"extends": [
"plugin:@angular-eslint/template/recommended"
],
"rules": {}
}
]
}
If I have understood correctly, this is the way to do it.
The premade configs I extend, by @angular-eslint, takes care of the parser options behind the scenes.
Therefore, the only thing I had to do was:
In the "files": ["*.ts"]
override, I added
"plugins": ["rxjs-angular"],
and
"rxjs-angular/prefer-async-pipe": "error"
in the rules section.