feat: eslint v9 with flat config (#2075)

Author: juliusmarminge

.changeset/config.json

@@ -10,6 +10,6 @@
   "access": "public",
   "baseBranch": "main",
   "updateInternalDependencies": "patch",
-  "ignore": ["@ct3a/www", "@ct3a/upgrade"],
+  "ignore": ["@ct3a/www"],
   "changedFilePatterns": ["src/**", "template/**"]
 }

.changeset/proud-trainers-swim.md

@@ -0,0 +1,5 @@
+---
+"create-t3-app": minor
+---
+
+feat: use eslint v9 with flat config

.eslintrc.cjs

@@ -0,0 +1,72 @@
+// @ts-check
+import tseslint from "typescript-eslint";
+// import isaacscript from "eslint-plugin-isaacscript";
+import importPlugin from "eslint-plugin-import-x";
+
+export default tseslint.config(
+  { ignores: ["dist", "*.config.*"] },
+  {
+    files: ["**/*.{ts,tsx}"],
+    plugins: {
+      // isaacscript, // REENABLE
+      "import-x": importPlugin,
+    },
+    extends: [
+      ...tseslint.configs.recommended,
+    ],
+    rules: {
+      "@typescript-eslint/no-unused-vars": [
+        "error",
+        { argsIgnorePattern: "^_", destructuredArrayIgnorePattern: "^_" },
+      ],
+      "@typescript-eslint/consistent-type-imports": [
+        "error",
+        { prefer: "type-imports", fixStyle: "inline-type-imports" },
+      ],
+      "import-x/consistent-type-specifier-style": ["error", "prefer-inline"],
+
+      // // For educational purposes we format our comments/jsdoc nicely
+      // "isaacscript/complete-sentences-jsdoc": "warn",
+      // "isaacscript/format-jsdoc-comments": "warn",
+
+      // These lint rules don't make sense for us but are enabled in the preset configs
+      "@typescript-eslint/no-confusing-void-expression": "off",
+      "@typescript-eslint/restrict-template-expressions": "off",
+
+      // This rule doesn't seem to be working properly
+      "@typescript-eslint/prefer-nullish-coalescing": "off",
+    },
+  },
+  {
+    files: ["src/**/*.{ts,tsx}"],
+    extends: [
+      ...tseslint.configs.recommendedTypeChecked,
+      ...tseslint.configs.stylisticTypeChecked,
+    ],
+    rules: {
+      "@typescript-eslint/no-explicit-any": "error",
+    },
+  },
+  {
+    // Template files don't have reliable type information
+    files: ["./template/**/*.{ts,tsx}"],
+    extends: [tseslint.configs.disableTypeChecked],
+  },
+  {
+    linterOptions: {
+      reportUnusedDisableDirectives: true,
+    },
+    languageOptions: {
+      sourceType: "module",
+      parserOptions: {
+        project: [
+          "./tsconfig.eslint.json",
+        ],
+        // projectService: {
+        //   defaultProject: "tsconfig.eslint.json",
+        // },
+        tsconfigRootDir: import.meta.dirname,
+      },
+    },
+  },
+);

cli/.eslintignore

@@ -40,7 +40,7 @@
     "dev": "tsup --watch",
     "clean": "rm -rf dist .turbo node_modules",
     "start": "node dist/index.js",
-    "lint": "eslint . --ext .ts,.tsx",
+    "lint": "eslint",
     "lint:fix": "pnpm lint --fix",
     "format": "prettier '**/*.{cjs,mjs,ts,tsx,md,json}' --ignore-path ../.gitignore --ignore-unknown --no-error-on-unmatched-pattern --write",
     "format:check": "prettier '**/*.{cjs,mjs,ts,tsx,md,json}' --ignore-path ../.gitignore --ignore-unknown --no-error-on-unmatched-pattern --check",
@@ -79,12 +79,12 @@
     "@types/gradient-string": "^1.1.6",
     "@types/node": "^20.14.10",
     "drizzle-kit": "^0.30.5",
-    "drizzle-orm": "^0.40.0",
+    "drizzle-orm": "^0.41.0",
     "mysql2": "^3.11.0",
     "next": "^15.2.3",
     "next-auth": "^4.24.7",
     "postgres": "^3.4.4",
-    "prettier": "^3.3.2",
+    "prettier": "^3.5.3",
     "prettier-plugin-tailwindcss": "^0.6.11",
     "prisma": "^5.14.0",
     "react": "^18.3.0",

cli/eslint.config.js

@@ -55,7 +55,7 @@ const runInstallCommand = async (
 
           if (text.includes("Progress")) {
             spinner.text = text.includes("|")
-              ? text.split(" | ")[1] ?? ""
+              ? (text.split(" | ")[1] ?? "")
               : text;
           }
         },

cli/package.json

@@ -23,7 +23,7 @@ function replaceTextInFiles(
 export const setImportAlias = (projectDir: string, importAlias: string) => {
   const normalizedImportAlias = importAlias
     .replace(/\*/g, "") // remove any wildcards (~/* -> ~/)
-    .replace(/[^\/]$/, "$&/"); // ensure trailing slash (@ -> ~/)
+    .replace(/[^/]$/, "$&/"); // ensure trailing slash (@ -> ~/)
 
   // update import alias in any files if not using the default
   replaceTextInFiles(projectDir, `~/`, normalizedImportAlias);

cli/src/helpers/installDependencies.ts

@@ -15,7 +15,7 @@ export const dependencyVersionMap = {
 
   // Drizzle
   "drizzle-kit": "^0.30.5",
-  "drizzle-orm": "^0.40.0",
+  "drizzle-orm": "^0.41.0",
   mysql2: "^3.11.0",
   "@planetscale/database": "^1.19.0",
   postgres: "^3.4.4",
@@ -40,12 +40,11 @@ export const dependencyVersionMap = {
 
   // eslint / prettier
   prettier: "^3.3.2",
+  "@eslint/eslintrc": "^3.3.1",
   "prettier-plugin-tailwindcss": "^0.6.11",
-  eslint: "^8.57.0",
+  eslint: "^9.23.0",
   "eslint-config-next": "^15.2.3",
   "eslint-plugin-drizzle": "^0.2.3",
-  "@types/eslint": "^8.56.10",
-  "@typescript-eslint/eslint-plugin": "^8.1.0",
-  "@typescript-eslint/parser": "^8.1.0",
+  "typescript-eslint": "^8.27.0",
 } as const;
 export type AvailableDependencies = keyof typeof dependencyVersionMap;

cli/src/helpers/setImportAlias.ts

@@ -15,7 +15,7 @@ export const envVariablesInstaller: Installer = ({
   const usingPrisma = packages?.prisma.inUse;
   const usingDrizzle = packages?.drizzle.inUse;
 
-  const usingDb = usingPrisma || usingDrizzle;
+  const usingDb = usingPrisma === true || usingDrizzle === true;
   const usingPlanetScale = databaseProvider === "planetscale";
 
   const envContent = getEnvContent(