fix(angular): buildable libs should lint correctly #18802

nrwl · Aug 25, 2023 · b08d8c6 · b08d8c6
1 parent b9eba9d
commit b08d8c6
Show file tree

Hide file tree

Showing 8 changed files with 109 additions and 0 deletions.
diff --git a/packages/angular/src/generators/add-linting/__snapshots__/add-linting.spec.ts.snap b/packages/angular/src/generators/add-linting/__snapshots__/add-linting.spec.ts.snap
@@ -9,6 +9,13 @@ exports[`addLinting generator should correctly generate the .eslintrc.json file
     "!**/*",
   ],
   "overrides": [
+    {
+      "files": [
+        "*.json",
+      ],
+      "parser": "jsonc-eslint-parser",
+      "rules": {},
+    },
     {
       "extends": [
         "plugin:@nx/angular",
@@ -58,6 +65,13 @@ exports[`addLinting generator support angular v14 should correctly generate the
     "!**/*",
   ],
   "overrides": [
+    {
+      "files": [
+        "*.json",
+      ],
+      "parser": "jsonc-eslint-parser",
+      "rules": {},
+    },
     {
       "extends": [
         "plugin:@nx/angular",

diff --git a/packages/angular/src/generators/add-linting/add-linting.ts b/packages/angular/src/generators/add-linting/add-linting.ts
@@ -47,6 +47,11 @@ export async function addLintingGenerator(
       .includes(`${options.projectRoot}/tsconfig.*?.json`);
 
     replaceOverridesInLintConfig(tree, options.projectRoot, [
+      {
+        files: ['*.json'],
+        parser: 'jsonc-eslint-parser',
+        rules: {},
+      },
       {
         files: ['*.ts'],
         ...(hasParserOptions

diff --git a/packages/angular/src/generators/add-linting/lib/add-angular-eslint-dependencies.ts b/packages/angular/src/generators/add-linting/lib/add-angular-eslint-dependencies.ts
@@ -4,13 +4,16 @@ import { versions } from '../../utils/version-utils';
 
 export function addAngularEsLintDependencies(tree: Tree): GeneratorCallback {
   const angularEslintVersionToInstall = versions(tree).angularEslintVersion;
+  const jsoncEslintParserVersionToInstall =
+    versions(tree).jsoncEslintParserVersion;
   return addDependenciesToPackageJson(
     tree,
     {},
     {
       '@angular-eslint/eslint-plugin': angularEslintVersionToInstall,
       '@angular-eslint/eslint-plugin-template': angularEslintVersionToInstall,
       '@angular-eslint/template-parser': angularEslintVersionToInstall,
+      'jsonc-eslint-parser': jsoncEslintParserVersionToInstall,
     }
   );
 }
diff --git a/packages/angular/src/generators/application/application.spec.ts b/packages/angular/src/generators/application/application.spec.ts
@@ -512,6 +512,13 @@ describe('app', () => {
               "!**/*",
             ],
             "overrides": [
+              {
+                "files": [
+                  "*.json",
+                ],
+                "parser": "jsonc-eslint-parser",
+                "rules": {},
+              },
               {
                 "extends": [
                   "plugin:@nx/angular",

diff --git a/...c/generators/convert-tslint-to-eslint/__snapshots__/convert-tslint-to-eslint.spec.ts.snap b/...c/generators/convert-tslint-to-eslint/__snapshots__/convert-tslint-to-eslint.spec.ts.snap
@@ -253,6 +253,13 @@ exports[`convert-tslint-to-eslint should not override .eslint config if migratio
     "!**/*",
   ],
   "overrides": [
+    {
+      "files": [
+        "*.json",
+      ],
+      "parser": "jsonc-eslint-parser",
+      "rules": {},
+    },
     {
       "extends": [
         "plugin:@nx/angular",
@@ -561,6 +568,7 @@ exports[`convert-tslint-to-eslint should work for Angular applications 1`] = `
     "eslint": "~8.46.0",
     "eslint-config-prettier": "8.1.0",
     "eslint-plugin-import": "latest",
+    "jsonc-eslint-parser": "^2.1.0",
   },
   "name": "test-name",
 }
@@ -843,6 +851,13 @@ exports[`convert-tslint-to-eslint should work for Angular applications 4`] = `
     "!**/*",
   ],
   "overrides": [
+    {
+      "files": [
+        "*.json",
+      ],
+      "parser": "jsonc-eslint-parser",
+      "rules": {},
+    },
     {
       "extends": [
         "plugin:@nx/angular",
@@ -913,6 +928,7 @@ exports[`convert-tslint-to-eslint should work for Angular libraries 1`] = `
     "eslint": "~8.46.0",
     "eslint-config-prettier": "8.1.0",
     "eslint-plugin-import": "latest",
+    "jsonc-eslint-parser": "^2.1.0",
   },
   "name": "test-name",
 }
@@ -1195,6 +1211,13 @@ exports[`convert-tslint-to-eslint should work for Angular libraries 4`] = `
     "!**/*",
   ],
   "overrides": [
+    {
+      "files": [
+        "*.json",
+      ],
+      "parser": "jsonc-eslint-parser",
+      "rules": {},
+    },
     {
       "extends": [
         "plugin:@nx/angular",

diff --git a/packages/angular/src/generators/library/library.spec.ts b/packages/angular/src/generators/library/library.spec.ts
@@ -591,6 +591,52 @@ describe('lib', () => {
         expect(tree.exists(path)).toBeTruthy();
       });
 
+      expect(tree.read('my-dir/my-lib/.eslintrc.json', 'utf-8'))
+        .toMatchInlineSnapshot(`
+        "{
+          "extends": ["../../.eslintrc.json"],
+          "ignorePatterns": ["!**/*"],
+          "overrides": [
+            {
+              "files": ["*.json"],
+              "parser": "jsonc-eslint-parser",
+              "rules": {}
+            },
+            {
+              "files": ["*.ts"],
+              "extends": [
+                "plugin:@nx/angular",
+                "plugin:@angular-eslint/template/process-inline-templates"
+              ],
+              "rules": {
+                "@angular-eslint/directive-selector": [
+                  "error",
+                  {
+                    "type": "attribute",
+                    "prefix": "proj",
+                    "style": "camelCase"
+                  }
+                ],
+                "@angular-eslint/component-selector": [
+                  "error",
+                  {
+                    "type": "element",
+                    "prefix": "proj",
+                    "style": "kebab-case"
+                  }
+                ]
+              }
+            },
+            {
+              "files": ["*.html"],
+              "extends": ["plugin:@nx/angular-template"],
+              "rules": {}
+            }
+          ]
+        }
+        "
+      `);
+
       // Make sure these have properties
       [
         {
@@ -1111,6 +1157,13 @@ describe('lib', () => {
               "!**/*",
             ],
             "overrides": [
+              {
+                "files": [
+                  "*.json",
+                ],
+                "parser": "jsonc-eslint-parser",
+                "rules": {},
+              },
               {
                 "extends": [
                   "plugin:@nx/angular",

diff --git a/packages/angular/src/utils/backward-compatible-versions.ts b/packages/angular/src/utils/backward-compatible-versions.ts
@@ -37,6 +37,7 @@ export const backwardCompatibleVersions: Record<
     jestPresetAngularVersion: '~12.2.3',
     typesNodeVersion: '16.11.7',
     jasmineMarblesVersion: '^0.9.2',
+    jsoncEslintParserVersion: '^2.1.0',
   },
   angularV15: {
     angularVersion: '~15.2.0',
@@ -64,5 +65,6 @@ export const backwardCompatibleVersions: Record<
     jestPresetAngularVersion: '~13.0.0',
     typesNodeVersion: '16.11.7',
     jasmineMarblesVersion: '^0.9.2',
+    jsoncEslintParserVersion: '^2.1.0',
   },
 };
diff --git a/packages/angular/src/utils/versions.ts b/packages/angular/src/utils/versions.ts
@@ -28,3 +28,5 @@ export const tsNodeVersion = '10.9.1';
 export const jestPresetAngularVersion = '~13.1.0';
 export const typesNodeVersion = '16.11.7';
 export const jasmineMarblesVersion = '^0.9.2';
+
+export const jsoncEslintParserVersion = '^2.1.0';