@mlaursen/eslint-config 12.0.6 → 12.0.7

package/dist/index.mjs

@@ -0,0 +1,645 @@
+import eslint from '@eslint/js';
+import jsxA11yPlugin from 'eslint-plugin-jsx-a11y';
+import reactPlugin from 'eslint-plugin-react';
+import reactHooksPlugin from 'eslint-plugin-react-hooks';
+import reactRefreshPlugin from 'eslint-plugin-react-refresh';
+import vitestPlugin from '@vitest/eslint-plugin';
+import jestPlugin from 'eslint-plugin-jest';
+import jestDomPlugin from 'eslint-plugin-jest-dom';
+import tseslint from 'typescript-eslint';
+import eslintPluiginUnicorn from 'eslint-plugin-unicorn';
+import testingLibraryPlugin from 'eslint-plugin-testing-library';
+import { includeIgnoreFile } from '@eslint/compat';
+import { fileURLToPath } from 'node:url';
+
+const DEV_WARNING_PROD_ERROR = process.env["NODE_ENV"] === "production" ? "error" : "warn";
+/**
+ * This is a "temporary" workaround until autofixable rules can be disabled with
+ * a config option because of the "autofix + format(+ save)?" behavior. It
+ * should be something closer to `DEV_WARN_PROD_ERROR_AND_FIX`
+ */ const DEV_OFF_PROD_ERROR = process.env["NODE_ENV"] === "production" ? "error" : "off";
+const BASE_NAME = "@mlaursen/eslint-config";
+const TS_FILES = [
+    "**/*.{ts,tsx,mts,mtsx}"
+];
+const TEST_FILES = [
+    "**/__tests__/**",
+    "**/*.{spec,test}.{ts,tsx,js,jsx}"
+];
+const JSX_FILES = [
+    "**/*.{js,mjs,cjs,jsx,mjsx,ts,tsx,mtsx}"
+];
+const VITE_MAIN_FILES = [
+    "**/main.tsx"
+];
+
+/**
+ * @example
+ * ```js
+ * import { configs } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ *
+ * export default defineConfig(configs.base);
+ * ```
+ */ const base = [
+    eslint.configs.recommended,
+    {
+        name: `${BASE_NAME}/base`,
+        rules: {
+            // I use typescript instead
+            "no-undef": "off",
+            // You normally do not want `console.{whatever}` in prod but is fine for
+            // development in debugging
+            "no-console": DEV_WARNING_PROD_ERROR,
+            "no-var": "error",
+            "no-use-before-define": "warn",
+            // I want to enforce all statements to require curly braces even if it
+            // could be omitted for consistency
+            curly: "error",
+            // Since this is auto-fixable, I like `{ someproperty }` instead of
+            // `{ someproperty: someproperty }`
+            "object-shorthand": [
+                "error",
+                "always"
+            ],
+            // This is about the same as `object-shorthand`. Only rename if it has to
+            // be renamed
+            "no-useless-rename": [
+                "error"
+            ],
+            "no-eval": "error",
+            "no-alert": "error",
+            "no-lonely-if": "error",
+            "no-else-return": "error",
+            eqeqeq: "error",
+            // 100% stylistic, but do not allow `a = b = c = "whatever"` / `let a = whatever, b = whatever, c = whatever;`
+            // these should be different statements
+            "no-multi-assign": "error",
+            "no-sequences": "error",
+            // use template strings instead
+            "no-multi-str": "error",
+            // better to use new variables most of the time
+            "no-param-reassign": "error",
+            // i'd never hit these, but who trusts other people and AI?
+            "no-return-assign": "error",
+            "no-script-url": "error"
+        }
+    }
+];
+
+/**
+ * @example
+ * ```ts
+ * import { configs } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ *
+ * export default defineConfig(configs.jsxA11y);
+ * ```
+ */ const jsxA11y = [
+    {
+        name: `${BASE_NAME}/jsx-a11y`,
+        files: JSX_FILES,
+        ...jsxA11yPlugin.flatConfigs.recommended,
+        rules: {
+            ...jsxA11yPlugin.flatConfigs.recommended.rules,
+            // I **only** use autoFocus within dialogs which provide the correct
+            // context for screen readers.
+            "jsx-a11y/no-autofocus": "off"
+        }
+    },
+    {
+        name: `${BASE_NAME}/jsx-a11y/testing`,
+        files: TEST_FILES,
+        rules: {
+            "jsx-a11y/anchor-has-content": "off",
+            "jsx-a11y/click-events-have-key-events": "off",
+            "jsx-a11y/no-static-element-interactions": "off"
+        }
+    }
+];
+
+/**
+ * @example
+ * ```ts
+ * import { configs } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ *
+ * export default defineConfig(configs.react());
+ *
+ * // or with react compiler rules enabled
+ * export default defineConfig(configs.react(true));
+ * ```
+ *
+ * Enables:
+ * - `eslint-plugin-react` with:
+ *   - flat.recommended
+ *   - flat['jsx-runtime']
+ * - `eslint-plugin-react-hooks` with:
+ *   - recommended rules
+ *   - compiler rules (if `true` is provided)
+ */ const react = (options = {})=>{
+    const { reactRefresh, reactCompiler } = options;
+    return [
+        {
+            ...reactPlugin.configs.flat["recommended"],
+            name: `${BASE_NAME}/react`,
+            files: JSX_FILES,
+            settings: {
+                react: {
+                    version: "detect"
+                }
+            },
+            rules: {
+                ...reactPlugin.configs.flat["recommended"]?.rules,
+                ...reactPlugin.configs.flat["jsx-runtime"]?.rules
+            }
+        },
+        {
+            ...reactHooksPlugin.configs.flat.recommended,
+            name: `${BASE_NAME}/react-hooks`,
+            rules: {
+                ...reactCompiler && reactHooksPlugin.configs.flat.recommended.rules,
+                "react-hooks/rules-of-hooks": "error",
+                "react-hooks/exhaustive-deps": [
+                    "error",
+                    {
+                        additionalHooks: "(useIsomorphicLayoutEffect)"
+                    }
+                ]
+            }
+        },
+        ...reactRefresh ? [
+            {
+                ...reactRefreshPlugin.configs[reactRefresh],
+                name: `${BASE_NAME}/react-refresh`,
+                ignores: [
+                    "**/test-utils*",
+                    "**/test-utils/**"
+                ]
+            }
+        ] : []
+    ];
+};
+
+/**
+ * @example
+ * ```ts
+ * import { configs } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ *
+ * export default defineConfig(configs.scripts);
+ * ```
+ */ const scripts = [
+    {
+        name: `${BASE_NAME}/scripts`,
+        files: [
+            "scripts/**"
+        ],
+        rules: {
+            "no-console": "off"
+        }
+    }
+];
+
+/**
+ * @example
+ * ```ts
+ * import { configs } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ *
+ * export default defineConfig(configs.vitest);
+ * ```
+ */ const vitest = [
+    {
+        name: `${BASE_NAME}/vitest`,
+        files: TEST_FILES,
+        plugins: {
+            vitest: vitestPlugin
+        },
+        rules: {
+            ...vitestPlugin.configs.recommended.rules,
+            "vitest/no-alias-methods": "error",
+            "vitest/no-focused-tests": DEV_OFF_PROD_ERROR,
+            "vitest/no-disabled-tests": DEV_OFF_PROD_ERROR,
+            "vitest/no-duplicate-hooks": "error",
+            "vitest/no-standalone-expect": "error",
+            "vitest/prefer-expect-resolves": "error",
+            "vitest/prefer-spy-on": "error",
+            "vitest/prefer-vi-mocked": "error"
+        }
+    }
+];
+/**
+ * @example
+ * ```ts
+ * import { configs } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ *
+ * export default defineConfig(configs.jest);
+ * ```
+ */ const jest = [
+    {
+        name: `${BASE_NAME}/jest`,
+        files: TEST_FILES,
+        ...jestPlugin.configs["flat/recommended"]
+    }
+];
+/**
+ * @example
+ * ```ts
+ * import { configs } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ *
+ * export default defineConfig([
+ *   ...configs.jest,
+ *   ...configs.jestDom,
+ * ]);
+ * ```
+ */ const jestDom = [
+    {
+        name: `${BASE_NAME}/jest-dom`,
+        files: TEST_FILES,
+        ...jestDomPlugin.configs["flat/recommended"]
+    }
+];
+/**
+ * @example
+ * ```ts
+ * import { configs } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ *
+ * export default defineConfig(configs.testing({ testFramework: "jest" }));
+ *
+ * // or
+ * export default defineConfig(configs.testing({ testFramework: "vitest" }));
+ * ```
+ */ const testing = (options = {})=>{
+    const { testFramework = "vitest" } = options;
+    let config;
+    switch(testFramework){
+        case "jest":
+            config = jest;
+            break;
+        case "vitest":
+            config = vitest;
+            break;
+    }
+    return [
+        ...config,
+        ...jestDom
+    ];
+};
+
+/**
+ * @example
+ * ```ts
+ * import { configs, gitignore } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ *
+ * export default defineConfig([
+ *   gitignore(import.meta.url),
+ *   ...configs.typescript(),
+ * ]);
+ * ```
+ */ const typescript = (options = {})=>{
+    const { tsconfigRootDir, strictTypeChecked } = options;
+    const configs = [
+        ...base,
+        ...tseslint.configs.strict,
+        {
+            name: `${BASE_NAME}/typescript`,
+            files: TS_FILES,
+            rules: {
+                // I normally do not want unified signatures since it helps improve type
+                // inference with function overloading
+                "@typescript-eslint/unified-signatures": "off",
+                // I prefer specifying when something is used only as a type
+                "@typescript-eslint/consistent-type-imports": [
+                    "error",
+                    {
+                        fixStyle: "inline-type-imports"
+                    }
+                ],
+                // I prefer shorthand syntax
+                "@typescript-eslint/array-type": [
+                    "error",
+                    {
+                        default: "array"
+                    }
+                ],
+                // I prefer using `interface` over `type = {}`
+                "@typescript-eslint/consistent-type-definitions": [
+                    "error",
+                    "interface"
+                ],
+                // Allow expressions to work with react hooks. Annoying to have to
+                // typedef each arrow function in a `useEffect` or `useCallback` when
+                // it can be derived.
+                "@typescript-eslint/explicit-function-return-type": [
+                    "error",
+                    {
+                        allowExpressions: true,
+                        // allow FC definitions for React
+                        allowTypedFunctionExpressions: true
+                    }
+                ],
+                "@typescript-eslint/no-unused-vars": [
+                    "error",
+                    {
+                        argsIgnorePattern: "^_",
+                        varsIgnorePattern: "^_"
+                    }
+                ],
+                "no-use-before-define": "off",
+                "@typescript-eslint/no-use-before-define": [
+                    "warn",
+                    {
+                        ignoreTypeReferences: true
+                    }
+                ]
+            }
+        },
+        {
+            name: `${BASE_NAME}/typescript/tests`,
+            files: TEST_FILES,
+            rules: {
+                // allow tests to be less strict
+                "@typescript-eslint/ban-ts-comment": "off",
+                "@typescript-eslint/explicit-function-return-type": "off",
+                "@typescript-eslint/no-empty-function": "off",
+                "@typescript-eslint/no-explicit-any": "off",
+                "@typescript-eslint/no-object-literal-type-assertion": "off",
+                "@typescript-eslint/no-var-requires": "off"
+            }
+        },
+        {
+            name: `${BASE_NAME}/typescript/vite`,
+            files: VITE_MAIN_FILES,
+            rules: {
+                // allow `createRoot(document.getElementById("root")).render(...)` for
+                // `vite` without disabling eslint
+                "@typescript-eslint/no-non-null-assertion": "off"
+            }
+        }
+    ];
+    if (tsconfigRootDir) {
+        configs.push({
+            name: `${BASE_NAME}/typescript-type-checking-language-options`,
+            languageOptions: {
+                parserOptions: {
+                    projectService: strictTypeChecked,
+                    tsconfigRootDir
+                }
+            }
+        });
+    }
+    if (strictTypeChecked) {
+        configs.push(...tseslint.configs.strictTypeCheckedOnly, {
+            name: `${BASE_NAME}/typescript-type-checking`,
+            files: TS_FILES,
+            rules: {
+                // I do not enable the `noUncheckedIndexedAccess` tsconfig option, so I
+                // still need to verify that stuff exists. There are other cases where I
+                // know it exists, so I can ignore those as well
+                "@typescript-eslint/no-unnecessary-condition": "off",
+                // I never use `this`
+                "@typescript-eslint/unbound-method": "off",
+                "@typescript-eslint/restrict-template-expressions": [
+                    "error",
+                    {
+                        allowNumber: true
+                    }
+                ],
+                // I want to allow `onClick={async (event) => { ... }}`
+                "@typescript-eslint/no-misused-promises": [
+                    "error",
+                    {
+                        checksVoidReturn: false
+                    }
+                ]
+            }
+        }, {
+            name: `${BASE_NAME}/typescript-type-checking/tests`,
+            files: TEST_FILES,
+            rules: {
+                // like base typescript, can be less strict in tests
+                "@typescript-eslint/no-unsafe-return": "off",
+                "@typescript-eslint/no-unsafe-assignment": "off",
+                "@typescript-eslint/restrict-template-expressions": "off"
+            }
+        });
+    }
+    return configs;
+};
+
+const unicorn = [
+    {
+        ...eslintPluiginUnicorn.configs.recommended,
+        name: `${BASE_NAME}/unicorn`,
+        rules: {
+            ...eslintPluiginUnicorn.configs.recommended.rules,
+            //  this flags `dist` and `dest` which is annoying
+            "unicorn/prevent-abbreviations": "off",
+            // I do not like using the default exports from `node:path`, `node:fs`,
+            // etc
+            "unicorn/import-style": "off",
+            // I want PascalCase for React components/classes, camelCase for others.
+            // Don't care enough to enforce through a rule and don't think it's
+            // possible.
+            "unicorn/filename-case": "off",
+            // prettier instead
+            "unicorn/empty-brace-spaces": "off",
+            // I like `null`
+            "unicorn/no-null": "off",
+            // the description is incorrect since it attempts converting multi-line
+            // statements to ternary which is awful:
+            //
+            // > This rule enforces the use of ternary expressions over 'simple'
+            // > if-else statements, where 'simple' means the consequent and alternate
+            // > are each one line and have the same basic type and form.
+            "unicorn/prefer-ternary": "off",
+            // I don't care about adding braces to switch cases. I'd prefer
+            // `["error", "avoid"]` more though since it only adds them when needed.
+            "unicorn/switch-case-braces": "off"
+        }
+    },
+    {
+        name: `${BASE_NAME}/unicorn/vite`,
+        files: VITE_MAIN_FILES,
+        rules: {
+            // allow `createRoot(document.getElementById("root")).render(...)` for
+            // `vite` without disabling eslint
+            "unicorn/prefer-query-selector": "off"
+        }
+    },
+    {
+        name: `${BASE_NAME}/unicorn/testing`,
+        files: TEST_FILES,
+        rules: {
+            // allow functions to be scoped to tests
+            "unicorn/consistent-function-scoping": "off"
+        }
+    }
+];
+
+/**
+ * @example
+ * ```ts
+ * import { configs, gitignore } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ *
+ * export default defineConfig([
+ *   gitignore(import.meta.url),
+ *   ...configs.recommended(),
+ * ]);
+ * ```
+ */ const recommended = (options = {})=>{
+    return [
+        ...typescript(options),
+        ...scripts,
+        ...testing(options),
+        ...unicorn
+    ];
+};
+
+const mui = [
+    {
+        name: `${BASE_NAME}/material-ui`,
+        files: JSX_FILES,
+        rules: {
+            "no-restricted-imports": [
+                "error",
+                {
+                    // https://mui.com/material-ui/guides/minimizing-bundle-size/#enforce-best-practices-with-eslint
+                    patterns: [
+                        {
+                            regex: "^@mui/(?!(x-|utils))[^/]+$"
+                        }
+                    ]
+                }
+            ]
+        }
+    }
+];
+
+/**
+ * @example
+ * ```ts
+ * import { configs } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ *
+ * export default defineConfig([
+ *   ...configs.react,
+ *   ...configs.jest,
+ *   ...configs.jestDom,
+ *   ...configs.testingLibraryReact
+ * ]);
+ * ```
+ *
+ * NOTE: Only choose this or the {@link testingLibraryDom}. Do not use
+ * both.
+ */ const testingLibraryReact = [
+    {
+        name: `${BASE_NAME}/testing-library/react`,
+        files: TEST_FILES,
+        ...testingLibraryPlugin.configs["flat/react"],
+        rules: {
+            ...testingLibraryPlugin.configs["flat/react"].rules,
+            // it can be useful to reassign screen.* queries without reusing to
+            // verify it still exists
+            "no-useless-assignment": "off"
+        }
+    }
+];
+/**
+ * @example
+ * ```ts
+ * import { configs, defineConfig } from "@mlaursen/eslint-config";
+ *
+ * export default defineConfig([
+ *   ...configs.jest,
+ *   ...configs.jestDom,
+ *   ...configs.testingLibraryDom
+ * ]);
+ * ```
+ *
+ * NOTE: Only choose this or the {@link testingLibraryReact}. Do not use
+ * both.
+ */ const testingLibraryDom = [
+    {
+        name: `${BASE_NAME}/testing-library/dom`,
+        files: TEST_FILES,
+        ...testingLibraryPlugin.configs["flat/dom"],
+        rules: {
+            ...testingLibraryPlugin.configs["flat/dom"].rules,
+            // it can be useful to reassign screen.* queries without reusing to
+            // verify it still exists
+            "no-useless-assignment": "off"
+        }
+    }
+];
+
+/**
+ * @example
+ * ```ts
+ * import { configs, gitignore } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ *
+ * export default defineConfig([
+ *   gitignore(import.meta.url),
+ *   ...configs.recommendedFrontend(),
+ * ]);
+ * ```
+ */ const recommendedFrontend = (options = {})=>{
+    return [
+        ...recommended(options),
+        ...mui,
+        ...react(options),
+        ...jsxA11y,
+        ...testingLibraryReact
+    ];
+};
+
+/**
+ * @example
+ * ```ts
+ * import { configs, gitignore } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ *
+ * export default defineConfig([gitignore(import.meta.url), ...configs.typescript]);
+ * ```
+ *
+ * @example .gitignore in a different folder
+ * ```ts
+ * import { configs, gitignore } from "@mlaursen/eslint-config";
+ * import { defineConfig } from "eslint/config";
+ * import { join } from "node:path";
+ *
+ * export default defineConfig([
+ *   gitignore(join(import.meta.url, "..", "..")),
+ *   ...configs.typescript,
+ * ]);
+ * ```
+ */ function gitignore(importMetaUrl) {
+    return includeIgnoreFile(fileURLToPath(new URL(".gitignore", importMetaUrl)));
+}
+
+const configs = {
+    recommended,
+    recommendedFrontend,
+    base,
+    jest,
+    jestDom,
+    react,
+    typescript,
+    testingLibraryDom,
+    testingLibraryReact,
+    scripts,
+    jsxA11y,
+    testing,
+    vitest,
+    unicorn
+};
+
+export { BASE_NAME, DEV_OFF_PROD_ERROR, DEV_WARNING_PROD_ERROR, JSX_FILES, TEST_FILES, TS_FILES, VITE_MAIN_FILES, configs, gitignore };
+//# sourceMappingURL=index.mjs.map