@nx/angular 19.8.0-canary.20240912-b6140d4 → 19.8.0-canary.20240914-dc821ab

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/angular",
-  "version": "19.8.0-canary.20240912-b6140d4",
+  "version": "19.8.0-canary.20240914-dc821ab",
   "private": false,
   "description": "The Nx Plugin for Angular contains executors, generators, and utilities for managing Angular applications and libraries within an Nx workspace. It provides: \n\n- Integration with libraries such as Storybook, Jest, ESLint, Tailwind CSS, Playwright and Cypress. \n\n- Generators to help scaffold code quickly (like: Micro Frontends, Libraries, both internal to your codebase and publishable to npm) \n\n- Single Component Application Modules (SCAMs) \n\n- NgRx helpers. \n\n- Utilities for automatic workspace refactoring.",
   "repository": {
@@ -69,7 +69,7 @@
   },
   "dependencies": {
     "@phenomnomnominal/tsquery": "~5.0.1",
-    "@typescript-eslint/type-utils": "^7.16.0",
+    "@typescript-eslint/type-utils": "^8.0.0",
     "chalk": "^4.1.0",
     "find-cache-dir": "^3.3.2",
     "magic-string": "~0.30.2",
@@ -79,14 +79,14 @@
     "webpack-merge": "^5.8.0",
     "webpack": "^5.88.0",
     "@module-federation/enhanced": "~0.6.0",
-    "@nx/devkit": "19.8.0-canary.20240912-b6140d4",
-    "@nx/js": "19.8.0-canary.20240912-b6140d4",
-    "@nx/eslint": "19.8.0-canary.20240912-b6140d4",
-    "@nx/webpack": "19.8.0-canary.20240912-b6140d4",
-    "@nx/web": "19.8.0-canary.20240912-b6140d4",
-    "@nx/workspace": "19.8.0-canary.20240912-b6140d4",
+    "@nx/devkit": "19.8.0-canary.20240914-dc821ab",
+    "@nx/js": "19.8.0-canary.20240914-dc821ab",
+    "@nx/eslint": "19.8.0-canary.20240914-dc821ab",
+    "@nx/webpack": "19.8.0-canary.20240914-dc821ab",
+    "@nx/web": "19.8.0-canary.20240914-dc821ab",
+    "@nx/workspace": "19.8.0-canary.20240914-dc821ab",
     "piscina": "^4.4.0",
-    "@nrwl/angular": "19.8.0-canary.20240912-b6140d4"
+    "@nrwl/angular": "19.8.0-canary.20240914-dc821ab"
   },
   "peerDependencies": {
     "@angular-devkit/build-angular": ">= 16.0.0 < 19.0.0",

package/src/generators/add-linting/add-linting.js

@@ -8,6 +8,7 @@ const global_eslint_config_1 = require("@nx/eslint/src/generators/init/global-es
 const eslint_file_1 = require("@nx/eslint/src/generators/utils/eslint-file");
 const add_angular_eslint_dependencies_1 = require("./lib/add-angular-eslint-dependencies");
 const buildable_project_1 = require("./lib/buildable-project");
+const flat_config_1 = require("@nx/eslint/src/utils/flat-config");
 async function addLintingGenerator(tree, options) {
     const tasks = [];
     const rootProject = options.projectRoot === '.' || options.projectRoot === '';
@@ -32,21 +33,11 @@ async function addLintingGenerator(tree, options) {
         const hasParserOptions = tree
             .read((0, devkit_1.joinPathFragments)(options.projectRoot, eslintFile), 'utf8')
             .includes(`${options.projectRoot}/tsconfig.*?.json`);
-        (0, eslint_file_1.replaceOverridesInLintConfig)(tree, options.projectRoot, [
-            ...(rootProject ? [global_eslint_config_1.typeScriptOverride, global_eslint_config_1.javaScriptOverride] : []),
-            {
+        if ((0, flat_config_1.useFlatConfig)(tree)) {
+            (0, eslint_file_1.addPredefinedConfigToFlatLintConfig)(tree, options.projectRoot, 'flat/angular');
+            (0, eslint_file_1.addPredefinedConfigToFlatLintConfig)(tree, options.projectRoot, 'flat/angular-template');
+            (0, eslint_file_1.addOverrideToLintConfig)(tree, options.projectRoot, {
                 files: ['*.ts'],
-                ...(hasParserOptions
-                    ? {
-                        parserOptions: {
-                            project: [`${options.projectRoot}/tsconfig.*?.json`],
-                        },
-                    }
-                    : {}),
-                extends: [
-                    'plugin:@nx/angular',
-                    'plugin:@angular-eslint/template/process-inline-templates',
-                ],
                 rules: {
                     '@angular-eslint/directive-selector': [
                         'error',
@@ -65,28 +56,92 @@ async function addLintingGenerator(tree, options) {
                         },
                     ],
                 },
-            },
-            {
+            });
+            (0, eslint_file_1.addOverrideToLintConfig)(tree, options.projectRoot, {
                 files: ['*.html'],
-                extends: ['plugin:@nx/angular-template'],
-                /**
-                 * Having an empty rules object present makes it more obvious to the user where they would
-                 * extend things from if they needed to
-                 */
                 rules: {},
-            },
-            ...((0, buildable_project_1.isBuildableLibraryProject)(tree, options.projectName)
-                ? [
-                    {
-                        files: ['*.json'],
-                        parser: 'jsonc-eslint-parser',
-                        rules: {
-                            '@nx/dependency-checks': 'error',
-                        },
+            });
+            if ((0, buildable_project_1.isBuildableLibraryProject)(tree, options.projectName)) {
+                (0, eslint_file_1.addOverrideToLintConfig)(tree, '', {
+                    files: ['*.json'],
+                    parser: 'jsonc-eslint-parser',
+                    rules: {
+                        '@nx/dependency-checks': [
+                            'error',
+                            {
+                                // With flat configs, we don't want to include imports in the eslint js/cjs/mjs files to be checked
+                                ignoredFiles: ['{projectRoot}/eslint.config.{js,cjs,mjs}'],
+                            },
+                        ],
+                    },
+                });
+            }
+        }
+        else {
+            (0, eslint_file_1.replaceOverridesInLintConfig)(tree, options.projectRoot, [
+                ...(rootProject ? [global_eslint_config_1.typeScriptOverride, global_eslint_config_1.javaScriptOverride] : []),
+                {
+                    files: ['*.ts'],
+                    ...(hasParserOptions
+                        ? {
+                            parserOptions: {
+                                project: [`${options.projectRoot}/tsconfig.*?.json`],
+                            },
+                        }
+                        : {}),
+                    extends: [
+                        'plugin:@nx/angular',
+                        'plugin:@angular-eslint/template/process-inline-templates',
+                    ],
+                    rules: {
+                        '@angular-eslint/directive-selector': [
+                            'error',
+                            {
+                                type: 'attribute',
+                                prefix: (0, string_utils_1.camelize)(options.prefix),
+                                style: 'camelCase',
+                            },
+                        ],
+                        '@angular-eslint/component-selector': [
+                            'error',
+                            {
+                                type: 'element',
+                                prefix: (0, string_utils_1.dasherize)(options.prefix),
+                                style: 'kebab-case',
+                            },
+                        ],
                     },
-                ]
-                : []),
-        ]);
+                },
+                {
+                    files: ['*.html'],
+                    extends: ['plugin:@nx/angular-template'],
+                    /**
+                     * Having an empty rules object present makes it more obvious to the user where they would
+                     * extend things from if they needed to
+                     */
+                    rules: {},
+                },
+                ...((0, buildable_project_1.isBuildableLibraryProject)(tree, options.projectName)
+                    ? [
+                        {
+                            files: ['*.json'],
+                            parser: 'jsonc-eslint-parser',
+                            rules: {
+                                '@nx/dependency-checks': [
+                                    'error',
+                                    {
+                                        // With flat configs, we don't want to include imports in the eslint js/cjs/mjs files to be checked
+                                        ignoredFiles: [
+                                            '{projectRoot}/eslint.config.{js,cjs,mjs}',
+                                        ],
+                                    },
+                                ],
+                            },
+                        },
+                    ]
+                    : []),
+            ]);
+        }
     }
     if (!options.skipPackageJson) {
         const installTask = (0, add_angular_eslint_dependencies_1.addAngularEsLintDependencies)(tree, options.projectName);

package/src/generators/add-linting/lib/add-angular-eslint-dependencies.js

@@ -4,14 +4,19 @@ exports.addAngularEsLintDependencies = addAngularEsLintDependencies;
 const devkit_1 = require("@nx/devkit");
 const version_utils_1 = require("../../utils/version-utils");
 const buildable_project_1 = require("./buildable-project");
+const flat_config_1 = require("@nx/eslint/src/utils/flat-config");
 function addAngularEsLintDependencies(tree, projectName) {
     const compatVersions = (0, version_utils_1.versions)(tree);
     const angularEslintVersionToInstall = compatVersions.angularEslintVersion;
-    const devDependencies = {
-        '@angular-eslint/eslint-plugin': angularEslintVersionToInstall,
-        '@angular-eslint/eslint-plugin-template': angularEslintVersionToInstall,
-        '@angular-eslint/template-parser': angularEslintVersionToInstall,
-    };
+    const devDependencies = (0, flat_config_1.useFlatConfig)(tree)
+        ? {
+            'angular-eslint': angularEslintVersionToInstall,
+        }
+        : {
+            '@angular-eslint/eslint-plugin': angularEslintVersionToInstall,
+            '@angular-eslint/eslint-plugin-template': angularEslintVersionToInstall,
+            '@angular-eslint/template-parser': angularEslintVersionToInstall,
+        };
     if ('typescriptEslintVersion' in compatVersions) {
         devDependencies['@typescript-eslint/utils'] =
             compatVersions.typescriptEslintVersion;

package/src/utils/versions.d.ts

@@ -14,7 +14,7 @@ export declare const typesExpressVersion = "4.17.14";
 export declare const browserSyncVersion = "^3.0.0";
 export declare const moduleFederationNodeVersion = "~2.5.0";
 export declare const moduleFederationEnhancedVersion = "~0.6.0";
-export declare const angularEslintVersion = "^18.0.1";
+export declare const angularEslintVersion = "^18.3.0";
 export declare const typescriptEslintVersion = "^7.16.0";
 export declare const tailwindVersion = "^3.0.2";
 export declare const postcssVersion = "^8.4.5";

package/src/utils/versions.js

@@ -17,7 +17,7 @@ exports.typesExpressVersion = '4.17.14';
 exports.browserSyncVersion = '^3.0.0';
 exports.moduleFederationNodeVersion = '~2.5.0';
 exports.moduleFederationEnhancedVersion = '~0.6.0';
-exports.angularEslintVersion = '^18.0.1';
+exports.angularEslintVersion = '^18.3.0';
 exports.typescriptEslintVersion = '^7.16.0';
 exports.tailwindVersion = '^3.0.2';
 exports.postcssVersion = '^8.4.5';