improve configs & fix bundler errors

Author: ianmacartney

eslint.config.js

@@ -1,36 +1,45 @@
 import globals from "globals";
 import pluginJs from "@eslint/js";
 import tseslint from "typescript-eslint";
+import reactHooks from "eslint-plugin-react-hooks";
+import reactRefresh from "eslint-plugin-react-refresh";
 
 export default [
-  { files: ["src/**/*.{js,mjs,cjs,ts,tsx}"] },
   {
     ignores: [
       "dist/**",
       "eslint.config.js",
+      "vitest.config.ts",
       "**/_generated/",
       "node10stubs.mjs",
     ],
   },
   {
+    files: ["src/**/*.{js,mjs,cjs,ts,tsx}", "example/**/*.{js,mjs,cjs,ts,tsx}"],
     languageOptions: {
-      globals: globals.worker,
       parser: tseslint.parser,
-
       parserOptions: {
-        project: true,
-        tsconfigRootDir: ".",
+        project: [
+          "./tsconfig.json",
+          "./example/tsconfig.json",
+          "./example/convex/tsconfig.json",
+        ],
+        tsconfigRootDir: import.meta.dirname,
       },
     },
   },
   pluginJs.configs.recommended,
   ...tseslint.configs.recommended,
+  // Convex code - Worker environment
   {
+    files: ["src/**/*.{ts,tsx}", "example/convex/**/*.{ts,tsx}"],
+    ignores: ["src/react/**"],
+    languageOptions: {
+      globals: globals.worker,
+    },
     rules: {
       "@typescript-eslint/no-floating-promises": "error",
-      "eslint-comments/no-unused-disable": "off",
-
-      // allow (_arg: number) => {} and const _foo = 1;
+      "@typescript-eslint/no-explicit-any": "off",
       "no-unused-vars": "off",
       "@typescript-eslint/no-unused-vars": [
         "warn",
@@ -39,6 +48,52 @@ export default [
           varsIgnorePattern: "^_",
         },
       ],
+      "@typescript-eslint/no-unused-expressions": [
+        "error",
+        {
+          allowShortCircuit: true,
+          allowTernary: true,
+          allowTaggedTemplates: true,
+        },
+      ],
+    },
+  },
+  // React app code - Browser environment
+  {
+    files: ["src/react/**/*.{ts,tsx}", "example/src/**/*.{ts,tsx}"],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+    plugins: {
+      "react-hooks": reactHooks,
+      "react-refresh": reactRefresh,
+    },
+    rules: {
+      ...reactHooks.configs.recommended.rules,
+      "react-refresh/only-export-components": [
+        "warn",
+        { allowConstantExport: true },
+      ],
+      "@typescript-eslint/no-explicit-any": "off",
+      "no-unused-vars": "off",
+      "@typescript-eslint/no-unused-vars": [
+        "warn",
+        {
+          argsIgnorePattern: "^_",
+          varsIgnorePattern: "^_",
+        },
+      ],
+    },
+  },
+  // Example config files (vite.config.ts, etc.) - Node environment
+  {
+    files: ["example/vite.config.ts", "example/**/*.config.{js,ts}"],
+    languageOptions: {
+      globals: {
+        ...globals.node,
+        ...globals.browser,
+      },
     },
   },
 ];

example/eslint.config.js

@@ -1,13 +1,13 @@
-import {
+import type {
   Expand,
   FunctionReference,
   GenericDataModel,
   GenericMutationCtx,
   GenericQueryCtx,
 } from "convex/server";
-import { GenericId } from "convex/values";
-import { NotificationFields } from "../component/schema.js";
-import { LogLevel } from "../logging/index.js";
+import type { GenericId } from "convex/values";
+import type { NotificationFields } from "../component/schema.js";
+import type { LogLevel } from "../logging/index.js";
 import type { ComponentApi } from "../component/_generated/component.js";
 
 /**

src/client/index.ts

@@ -1,6 +1,6 @@
 import {
   customAction,
-  CustomCtx,
+  type CustomCtx,
   customMutation,
   customQuery,
 } from "convex-helpers/server/customFunctions";

src/component/functions.ts

@@ -1,6 +1,6 @@
-import { MutationCtx } from "./functions.js";
+import type { MutationCtx } from "./functions.js";
 import { internal } from "./_generated/api.js";
-import { Doc } from "./_generated/dataModel.js";
+import type { Doc } from "./_generated/dataModel.js";
 
 export async function ensureCoordinator(ctx: MutationCtx) {
   ctx.logger.debug("Ensuring there's a notification coordinator");

src/component/helpers.ts

@@ -1,7 +1,7 @@
-import { JSONValue, v } from "convex/values";
+import { v, type JSONValue } from "convex/values";
 import { internalAction, internalMutation } from "./functions.js";
 import { internal } from "./_generated/api.js";
-import { Id } from "./_generated/dataModel.js";
+import type { Id } from "./_generated/dataModel.js";
 import { ensureCoordinator } from "./helpers.js";
 import { notificationFields } from "./schema.js";
 

src/component/internal.ts

@@ -1,5 +1,5 @@
-import { ConvexError, Infer, v } from "convex/values";
-import { mutation, MutationCtx, query } from "./functions.js";
+import { ConvexError, v, type Infer } from "convex/values";
+import { mutation, query, type MutationCtx } from "./functions.js";
 import { notificationFields, notificationState } from "./schema.js";
 import { ensureCoordinator, shutdownGracefully } from "./helpers.js";
 import { api } from "./_generated/api.js";

src/component/public.ts

@@ -1,4 +1,4 @@
-import { Infer, v } from "convex/values";
+import { v, type Infer } from "convex/values";
 
 export const logLevelValidator = v.union(
   v.literal("DEBUG"),