migrate react eslint to flat config

mshima · Jul 15, 2024 · cca3dab · cca3dab
1 parent ea5acd0
commit cca3dab
Show file tree

Hide file tree

Showing 19 changed files with 235 additions and 185 deletions.
diff --git a/.github/dependabot.yml b/.github/dependabot.yml
@@ -150,9 +150,10 @@ updates:
       - dependency-name: '@module-federation/utilities'
         versions: ['*']
     groups:
-      typescript-eslint:
+      eslint:
         patterns:
-          - '@typescript-eslint/*'
+          - '@eslint/*'
+          - 'eslint'
       fortawesome:
         patterns:
           - '@fortawesome/fontawesome-svg-core'

diff --git a/generators/client/files-common.js b/generators/client/files-common.js
@@ -27,6 +27,7 @@ export const files = {
       templates: ['README.md.jhi.client', '.prettierignore.jhi.client'],
     },
     clientRootTemplatesBlock({
+      condition: ctx => !ctx.clientFrameworkReact,
       templates: ['.eslintignore'],
     }),
     clientRootTemplatesBlock({

diff --git a/generators/client/templates/webpack/webpack.microfrontend.js.jhi.ejs b/generators/client/templates/webpack/webpack.microfrontend.js.jhi.ejs
@@ -42,7 +42,7 @@ const shareDependencies = ({ skipList = [] } = {}) =>
       .map(([dependency, version]) => [dependency, { ...sharedDefaults, version, requiredVersion: version }]),
   );
 
-module.exports = ({ serve }) => {
+module.exports = () => {
   return {
     optimization: {
       moduleIds: 'named',

diff --git a/generators/cypress/files.ts b/generators/cypress/files.ts
@@ -35,6 +35,10 @@ export const cypressFiles: WriteFileSection<CypressGenerator, CommonClientServer
     clientRootTemplatesBlock({
       templates: ['cypress.config.ts'],
     }),
+    clientRootTemplatesBlock({
+      condition: ctx => Boolean(ctx.eslintConfigFile),
+      templates: [{ sourceFile: 'eslint.config.js.jhi.cypress', destinationFile: ctx => `${ctx.eslintConfigFile}.jhi.cypress` }],
+    }),
   ],
   clientTestFw: [
     {

diff --git a/generators/cypress/templates/eslint.config.js.jhi.cypress.ejs b/generators/cypress/templates/eslint.config.js.jhi.cypress.ejs
@@ -0,0 +1,41 @@
+<%#
+ Copyright 2013-2024 the original author or authors from the JHipster project.
+
+ This file is part of the JHipster project, see https://www.jhipster.tech/
+ for more information.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+      https://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+-%>
+<&_ if (fragment.importsSection) { -&>
+import cypress from 'eslint-plugin-cypress/flat';
+<&_ } -&>
+<&_ if (fragment.configSection) { -&>
+  {
+    files: ['<%- this.relativeDir(clientRootDir, cypressDir) %>**/*.cy.ts'],
+    extends: [...tseslint.configs.recommendedTypeChecked, cypress.configs.recommended],
+    languageOptions: {
+      parserOptions: {
+        "project": ["./<%= this.relativeDir(clientRootDir, cypressDir) %>tsconfig.json"],
+      },
+    },
+    rules: {
+      '@typescript-eslint/no-explicit-any': 'warn',
+      '@typescript-eslint/no-unsafe-argument': 'warn',
+      '@typescript-eslint/no-unsafe-assignment': 'warn',
+      '@typescript-eslint/no-unsafe-call': 'warn',
+      '@typescript-eslint/no-unsafe-member-access': 'warn',
+      '@typescript-eslint/unbound-method': 'warn',
+      '@typescript-eslint/no-unused-vars': 'warn',
+    },
+  },
+<&_ } -&>
diff --git a/generators/react/__snapshots__/generator.spec.ts.snap b/generators/react/__snapshots__/generator.spec.ts.snap
@@ -17,10 +17,7 @@ exports[`generator - react gateway-jwt-skipUserManagement(true)-withAdminUi(fals
   ".yo-rc.json": {
     "stateCleared": "modified",
   },
-  "clientRoot/.eslintignore": {
-    "stateCleared": "modified",
-  },
-  "clientRoot/.eslintrc.json": {
+  "clientRoot/eslint.config.mjs": {
     "stateCleared": "modified",
   },
   "clientRoot/jest.conf.js": {
@@ -419,6 +416,9 @@ exports[`generator - react gateway-jwt-skipUserManagement(true)-withAdminUi(fals
   "clientRoot/webpack/webpack.prod.js": {
     "stateCleared": "modified",
   },
+  "package.json": {
+    "stateCleared": "modified",
+  },
 }
 `;
 
@@ -439,10 +439,7 @@ exports[`generator - react gateway-oauth2-withAdminUi(true)-skipJhipsterDependen
   ".yo-rc.json": {
     "stateCleared": "modified",
   },
-  "clientRoot/.eslintignore": {
-    "stateCleared": "modified",
-  },
-  "clientRoot/.eslintrc.json": {
+  "clientRoot/eslint.config.mjs": {
     "stateCleared": "modified",
   },
   "clientRoot/jest.conf.js": {
@@ -874,6 +871,9 @@ exports[`generator - react gateway-oauth2-withAdminUi(true)-skipJhipsterDependen
   "clientRoot/webpack/webpack.prod.js": {
     "stateCleared": "modified",
   },
+  "package.json": {
+    "stateCleared": "modified",
+  },
 }
 `;
 
@@ -894,10 +894,7 @@ exports[`generator - react microservice-jwt-skipUserManagement(false)-withAdminU
   ".yo-rc.json": {
     "stateCleared": "modified",
   },
-  "clientRoot/.eslintignore": {
-    "stateCleared": "modified",
-  },
-  "clientRoot/.eslintrc.json": {
+  "clientRoot/eslint.config.mjs": {
     "stateCleared": "modified",
   },
   "clientRoot/jest.conf.js": {
@@ -1302,17 +1299,14 @@ exports[`generator - react microservice-jwt-skipUserManagement(false)-withAdminU
   "clientRoot/webpack/webpack.prod.js": {
     "stateCleared": "modified",
   },
+  "package.json": {
+    "stateCleared": "modified",
+  },
 }
 `;
 
 exports[`generator - react microservice-oauth2-withAdminUi(true)-skipJhipsterDependencies(true)-enableTranslation(true)--websocket(false) should match generated files snapshot 1`] = `
 {
-  ".eslintignore": {
-    "stateCleared": "modified",
-  },
-  ".eslintrc.json": {
-    "stateCleared": "modified",
-  },
   ".jhipster/EntityWithCustomId.json": {
     "stateCleared": "modified",
   },
@@ -1328,6 +1322,9 @@ exports[`generator - react microservice-oauth2-withAdminUi(true)-skipJhipsterDep
   ".yo-rc.json": {
     "stateCleared": "modified",
   },
+  "eslint.config.mjs": {
+    "stateCleared": "modified",
+  },
   "jest.conf.js": {
     "stateCleared": "modified",
   },
@@ -1753,12 +1750,6 @@ exports[`generator - react microservice-oauth2-withAdminUi(true)-skipJhipsterDep
 
 exports[`generator - react monolith-jwt-skipUserManagement(false)-withAdminUi(true)-skipJhipsterDependencies(true)-enableTranslation(true)--websocket(true) should match generated files snapshot 1`] = `
 {
-  ".eslintignore": {
-    "stateCleared": "modified",
-  },
-  ".eslintrc.json": {
-    "stateCleared": "modified",
-  },
   ".jhipster/EntityWithCustomId.json": {
     "stateCleared": "modified",
   },
@@ -1774,6 +1765,9 @@ exports[`generator - react monolith-jwt-skipUserManagement(false)-withAdminUi(tr
   ".yo-rc.json": {
     "stateCleared": "modified",
   },
+  "eslint.config.mjs": {
+    "stateCleared": "modified",
+  },
   "jest.conf.js": {
     "stateCleared": "modified",
   },
@@ -2268,12 +2262,6 @@ exports[`generator - react monolith-jwt-skipUserManagement(false)-withAdminUi(tr
 
 exports[`generator - react monolith-oauth2-withAdminUi(false)-skipJhipsterDependencies(false)-enableTranslation(false)-websocket(false) should match generated files snapshot 1`] = `
 {
-  ".eslintignore": {
-    "stateCleared": "modified",
-  },
-  ".eslintrc.json": {
-    "stateCleared": "modified",
-  },
   ".jhipster/EntityWithCustomId.json": {
     "stateCleared": "modified",
   },
@@ -2289,6 +2277,9 @@ exports[`generator - react monolith-oauth2-withAdminUi(false)-skipJhipsterDepend
   ".yo-rc.json": {
     "stateCleared": "modified",
   },
+  "eslint.config.mjs": {
+    "stateCleared": "modified",
+  },
   "jest.conf.js": {
     "stateCleared": "modified",
   },
@@ -2693,12 +2684,6 @@ exports[`generator - react monolith-oauth2-withAdminUi(false)-skipJhipsterDepend
 
 exports[`generator - react monolith-session-skipUserManagement(true)-withAdminUi(false)-skipJhipsterDependencies(false)-enableTranslation(false)-websocket(true) should match generated files snapshot 1`] = `
 {
-  ".eslintignore": {
-    "stateCleared": "modified",
-  },
-  ".eslintrc.json": {
-    "stateCleared": "modified",
-  },
   ".jhipster/EntityWithCustomId.json": {
     "stateCleared": "modified",
   },
@@ -2714,6 +2699,9 @@ exports[`generator - react monolith-session-skipUserManagement(true)-withAdminUi
   ".yo-rc.json": {
     "stateCleared": "modified",
   },
+  "eslint.config.mjs": {
+    "stateCleared": "modified",
+  },
   "jest.conf.js": {
     "stateCleared": "modified",
   },

diff --git a/generators/react/files-react.js b/generators/react/files-react.js
@@ -16,14 +16,15 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import { asWriteFilesSection } from '../base-application/support/index.js';
 import { clientApplicationTemplatesBlock, clientRootTemplatesBlock, clientSrcTemplatesBlock } from '../client/support/files.js';
 
-export const files = {
+export const files = asWriteFilesSection({
   common: [
     clientRootTemplatesBlock({
       templates: [
+        { sourceFile: 'eslint.config.js.jhi.react', destinationFile: ctx => `${ctx.eslintConfigFile}.jhi.react` },
         'package.json',
-        '.eslintrc.json',
         'tsconfig.json',
         'tsconfig.test.json',
         'jest.conf.js',
@@ -304,7 +305,7 @@ export const files = {
       templates: ['shared/reducers/user-management.spec.ts'],
     },
   ],
-};
+});
 
 export async function writeFiles({ application }) {
   if (!application.clientFrameworkReact) return;

diff --git a/generators/react/generator.js b/generators/react/generator.js
@@ -29,6 +29,7 @@ import {
   generateEntityClientImports as formatEntityClientImports,
   generateTestEntityId as getTestEntityId,
   generateTestEntityPrimaryKey as getTestEntityPrimaryKey,
+  clientRootTemplatesBlock,
 } from '../client/support/index.js';
 import { createNeedleCallback, upperFirstCamelCase } from '../base/support/index.js';
 import { writeEntitiesFiles, postWriteEntitiesFiles, cleanupEntitiesFiles } from './entity-files-react.js';
@@ -40,17 +41,15 @@ import { isTranslatedReactFile, translateReactFilesTransform } from './support/i
 const { CommonDBTypes } = fieldTypes;
 const TYPE_BOOLEAN = CommonDBTypes.BOOLEAN;
 const { REACT } = clientFrameworkTypes;
-/**
- * @class
- * @extends {BaseApplicationGenerator<import('../client/types.js').ClientApplication>}
- */
+
 export default class ReactGenerator extends BaseApplicationGenerator {
   async beforeQueue() {
     if (!this.fromBlueprint) {
       await this.composeWithBlueprints();
     }
 
     if (!this.delegateToBlueprint) {
+      await this.dependsOnJHipster('jhipster:javascript:bootstrap');
       await this.dependsOnJHipster(GENERATOR_CLIENT);
       await this.dependsOnJHipster(GENERATOR_LANGUAGES);
     }
@@ -76,6 +75,12 @@ export default class ReactGenerator extends BaseApplicationGenerator {
           this.fetchFromInstalledJHipster(GENERATOR_REACT, 'resources', 'package.json'),
         );
       },
+      applicationDefauts({ applicationDefaults }) {
+        applicationDefaults({
+          __override__: true,
+          typescriptEslint: true,
+        });
+      },
     });
   }
 
@@ -85,9 +90,14 @@ export default class ReactGenerator extends BaseApplicationGenerator {
 
   get preparing() {
     return this.asPreparingTaskGroup({
+      applicationDefauts({ applicationDefaults }) {
+        applicationDefaults({
+          __override__: true,
+          eslintConfigFile: app => `eslint.config.${app.packageJsonType === 'module' ? 'js' : 'mjs'}`,
+          webappEnumerationsDir: app => `${app.clientSrcDir}app/shared/model/enumerations/`,
+        });
+      },
       prepareForTemplates({ application, source }) {
-        application.webappEnumerationsDir = `${application.clientSrcDir}app/shared/model/enumerations/`;
-
         source.addWebpackConfig = args => {
           const webpackPath = `${application.clientRootDir}webpack/webpack.common.js`;
           const ignoreNonExisting = this.sharedData.getControl().ignoreNeedlesError && 'Webpack configuration file not found';
@@ -142,10 +152,26 @@ export default class ReactGenerator extends BaseApplicationGenerator {
   }
 
   get writing() {
-    return {
+    return this.asWritingTaskGroup({
+      cleanup({ control }) {
+        control.cleanupFiles({
+          '8.6.1': ['.eslintrc.json', '.eslintignore'],
+        });
+      },
       cleanupOldFilesTask,
+      async writingEslintFile({ application }) {
+        await this.writeFiles({
+          blocks: [
+            clientRootTemplatesBlock({
+              templates: [{ sourceFile: 'eslint.config.js.jhi', destinationFile: ctx => `${ctx.eslintConfigFile}.jhi` }],
+            }),
+          ],
+          context: application,
+          rootTemplatesPath: this.fetchFromInstalledJHipster('javascript/generators/eslint/templates'),
+        });
+      },
       writeFiles,
-    };
+    });
   }
 
   get [BaseApplicationGenerator.WRITING]() {

diff --git a/generators/react/resources/package.json b/generators/react/resources/package.json
@@ -29,6 +29,7 @@
     "webstomp-client": "1.2.6"
   },
   "devDependencies": {
+    "@eslint/js": "8.57.0",
     "@module-federation/utilities": "3.0.3-0",
     "@testing-library/react": "16.0.0",
     "@types/jest": "29.5.12",
@@ -39,8 +40,6 @@
     "@types/react-redux": "7.1.33",
     "@types/redux": "3.6.31",
     "@types/webpack-env": "1.18.5",
-    "@typescript-eslint/eslint-plugin": "7.16.0",
-    "@typescript-eslint/parser": "7.16.0",
     "autoprefixer": "10.4.19",
     "browser-sync": "2.29.3",
     "browser-sync-webpack-plugin": "2.3.0",
@@ -51,6 +50,7 @@
     "css-minimizer-webpack-plugin": "7.0.0",
     "eslint": "8.57.0",
     "eslint-config-prettier": "9.1.0",
+    "eslint-plugin-prettier": "5.1.3",
     "eslint-plugin-react": "7.34.4",
     "eslint-webpack-plugin": "4.2.0",
     "folder-hash": "4.0.4",
@@ -81,6 +81,7 @@
     "ts-jest": "29.2.2",
     "ts-loader": "9.5.1",
     "typescript": "5.5.3",
+    "typescript-eslint": "7.16.0",
     "webpack": "5.93.0",
     "webpack-cli": "5.1.4",
     "webpack-dev-server": "5.0.4",