eslint flat config

.gitignore

@@ -19,5 +19,6 @@ node_modules
 .pmd
 .checkstyle
 .idea
+.vscode
 *.iml
 .DS_Store

CHANGELOG.md

@@ -1,5 +1,14 @@
 # Changelog
 
+## 5.0.0
+
+See [migration guide](./migration-guide-v5.md)!
+
+- Changed: moved to flat eslint config file.
+- Updated: rules which were moved to @stylistic plugin.
+- Updated: rules for typescript-eslint up to v8.23.0.
+- using valid-jsdoc eslint plugin to replace the deprecated `valid-jsdoc` rule.
+
 ## 4.0.0
 
 - Updated: updated for @typescript-eslint v6

README.md

@@ -2,128 +2,209 @@
 
 This package provides pro!vision's ESLint configuration as an extensible shared config.
 
-_Inspired by [Airbnb](https://github.com/airbnb/javascript/tree/master/packages/eslint-config-airbnb)_
+_Originally inspired by [Airbnb](https://github.com/airbnb/javascript/tree/master/packages/eslint-config-airbnb)_
 
 Rules mostly follow:
 
-- eslint:recommended
-- @typescript-eslint/recommended
+- eslint's `js.configs.recommended`
+- typescript-eslint's `strict-type-checked`
 
-## Versions
-
-This is version >= 3.1. of eslint-config-pv, which is compatible with eslint >= 8.45. If you are using eslint 3, use eslint-config-pv 1.0.10
+> [!IMPORTANT]
+> Since version 5.0.0, only the eslint's flat config file is supported, for older .eslintrc config files please use this package [@v4.0.0](https://www.npmjs.com/package/@pro-vision/eslint-config-pv/v/4.0.0).
 
 ## Installation
 
 ```bash
-npm install --save-dev @pro-vision/eslint-config-pv eslint-plugin-import
-# for the eslint 3 compatible version
-npm install --save-dev [email protected] eslint-plugin-import
+npm install --save-dev @pro-vision/eslint-config-pv eslint eslint-plugin-import eslint-plugin-jsdoc
+# in addition, for Typescript linting
+npm install --save-dev typescript-eslint typescript
+# in addition, to use with Prettier
+npm install --save-dev eslint-plugin-prettier eslint-config-prettier
 ```
 
-## Usage
-
-We export four ESLint configurations for usage in projects.
+See this projects [package.json](./package.json)'s devDependency list for the exact version which were tested against.
 
-### eslint-config-pv
+## Usage
 
-Our default export contains all of our ESLint rules, including ECMAScript 6 / ES2015.
-Add `"extends": "@pro-vision/eslint-config-pv"` to your .eslintrc:
+Create an `eslint.config.mjs` (or `eslint.config.cjs`) file with necessary presets and customized rules. For example:
 
 ```js
-{
-  "extends": "@pro-vision/eslint-config-pv",
-  "rules": {
-    // additional rules here
+// eslint.config.mjs
+
+import pvESLintTS from "@pro-vision/eslint-config-pv/typescript";
+import pvESLintPrettier from "@pro-vision/eslint-config-pv/prettier";
+
+export default [
+  ...pvESLintTS,
+  ...pvESLintPrettier,
+
+  // modify rules if needed
+  {
+    rules: {
+      "no-console": "off",
+      "@typescript-eslint/unbound-method": "off",
+      "import/order": [
+        "error",
+        {
+          "newlines-between": "always",
+          pathGroups: [
+            {
+              pattern: "{Helper,Components}/**",
+              group: "internal",
+            },
+          ],
+          pathGroupsExcludedImportTypes: [],
+          groups: ["builtin", "external", "internal", ["index", "sibling", "parent"]],
+        },
+      ],
+    }
   },
-  "env": {
-    // ... add more environments
-  }
-}
+]
 ```
 
-### eslint-config-pv/legacy
+In detail for specific use cases:
 
-Use the legacy sub package if you only want to lint ES5 and below.
+### Javascript files
 
 ```js
-{
-  "extends": "@pro-vision/eslint-config-pv/legacy",
-  "rules": {
-    // additional rules here
-  }
-}
+// eslint.config.mjs
+
+import pvESLintJS from "@pro-vision/eslint-config-pv/javascript";
+
+export default [
+  ...pvESLintJS,
+]
 ```
 
-### eslint-config-pv/prettier
+### Modifying rules
+
+```diff
+// eslint.config.mjs
+
+import pvESLintJS from "@pro-vision/eslint-config-pv/javascript";
+
+export default [
+  ...pvESLintJS,
+
++  {
++    rules: {
++      "no-console": "off",
++      "import/order": [
++        "error",
++        {
++          "newlines-between": "always",
++          pathGroups: [
++            {
++              pattern: "{Helper,Components}/**",
++              group: "internal",
++            },
++          ],
++          pathGroupsExcludedImportTypes: [],
++          groups: ["builtin", "external", "internal", ["index", "sibling", "parent"]],
++        },
++      ],
++    }
++  }
+]
+```
+
+### With prettier
 
-You need to install additional plugins:
+install these dependencies
 
 ```bash
-npm install --save-dev eslint-config-prettier eslint-plugin-prettier prettier
+npm install --save-dev eslint-plugin-prettier eslint-config-prettier
 ```
 
-This allows you to use prettier with eslint integration
+and update the eslint.config.mjs file
 
-```js
-{
-  "extends": "@pro-vision/eslint-config-pv/prettier"
-}
-```
+```diff
+// eslint.config.mjs
 
-See the [ESlint config docs](http://eslint.org/docs/user-guide/configuring#extending-configuration-files)
-for more information.
+  import pvESLintJS from "@pro-vision/eslint-config-pv/javascript";
++ import pvESLintPrettier from "@pro-vision/eslint-config-pv/prettier";
 
-### eslint-config-pv/typescript
+export default [
+    ...pvESLintJS,
++   ...pvESLintPrettier,
 
-You need to install `typescript` and additional `@typescript-eslint` plugins (>=v6.1.0):
+    {
+      rules: {
+        ...
+      }
+    }
+]
 
-```bash
-npm install --save-dev typescript @typescript-eslint/parser @typescript-eslint/eslint-plugin
 ```
 
-This allows you to eslint your typescript files
+This will run eslint with your prettier config in addition to the previous eslint rules and report any formatting issues / auto fix them.
 
-```js
-{
-  "extends": [
-    "@pro-vision/eslint-config-pv/typescript",
-    // "@pro-vision/eslint-config-pv/prettier" // in case you are using prettier as well
-  ]
-}
-```
+### For Typescript files
 
-`@pro-vision/eslint-config-pv/typescript` assumes your `tsconfig.json` file is in the same directory as where you call eslint. For example your projects root directory. But you can also specify this with:
+install the additional dependency
 
-```js
-{
-  "extends": [
-    "@pro-vision/eslint-config-pv/typescript",
-  ]
-  parserOptions: {
-    project: "./my-tsconfig.json",
-    tsconfigRootDir: "my-configs/",
-  },
-}
+```bash
+npm install --save-dev typescript-eslint
 ```
 
-## WebStorm Integration
+and update the eslint.config.mjs file using `eslint-config-pv/typescript` **Instead** of `eslint-config-pv/javascript` (It already contains all the rules in the /javascript config).
 
-Ensure you are using `node >= 4.5` and you have installed `eslint` and `eslint-plugin-import` globally:
+```diff
+// eslint.config.mjs
 
-```bash
-# node version should be at least 4.5
-node -v
+- import pvESLintJS from "@pro-vision/eslint-config-pv/javascript";
++ import pvESLintTS from "@pro-vision/eslint-config-pv/typescript";
+  import pvESLintPrettier from "@pro-vision/eslint-config-pv/prettier";
+
+export default [
+-  ...pvESLintJS,
++  ...pvESLintTS,
+   ...pvESLintPrettier,
 
-# install necessary modules globally
-npm install -g eslint eslint-plugin-import
+    {
+      rules: {
+        ...
+      }
+    }
+]
+
+```
+
+`@pro-vision/eslint-config-pv/typescript` assumes your `tsconfig.json` file is in the same directory as where you call eslint. i.e. your projects root directory. But you can also specify this with:
+
+```diff
+// eslint.config.mjs
+
+export default [
+  ...
++  {
++    languageOptions: {
++      parserOptions: {
++        project: "./my-tsconfig.json",
++        tsconfigRootDir: "my-configs/",
++      },
++    },
++  },
+]
 ```
 
-Now you can follow the instructions [here](https://www.jetbrains.com/help/webstorm/2016.2/using-javascript-code-quality-tools.html#ESLint)
+### For `.js` and `.ts` files in the same project
 
-Keep in mind that WebStorm pass all JavaScript files (starting from project root) to `eslint`. To prevent directories
-from being linted, mark them as _Excluded_. Go to project structure and right click on the directory to be excluded ->
-`Mark Directory as` -> `Excluded`. Special directories, such as `node_modules` are marked automatically as _library root_
-and will be excluded by default.
+`eslint-config-pv/typescript` rules will apply only to `.ts` and `.tsx` files, and the other rules (`eslint-config-pv/javascript` and `eslint-config-pv/prettier`) will apply to both. The only thing that you have make sure of is that any rule customization for `@typescript-eslint` that needs type information (see the [list of rules](https://typescript-eslint.io/rules/?=typeInformation)), are only applied to `.ts(x)` files. i.e.:
 
-Alternatively, you can define `.eslintignore` [as described here](http://eslint.org/docs/user-guide/configuring#ignoring-files-and-directories).
+```diff
+...
+  {
+    rules: {
+      "no-console": "off",
+-     "@typescript-eslint/no-misused-promises": ["error", { checksVoidReturn: false }],
+    }
+  },
++ {
++   files: ["**/*.ts", "**/*.tsx"],
++   rules: {
++     "@typescript-eslint/no-misused-promises": ["error", { checksVoidReturn: false }],
++   }
++ }
+
+```

__tests__/index.js

@@ -2,6 +2,9 @@
 "use strict";
 
 const ESLint = require("eslint").ESLint;
+
+const pvESLintJS = require("../javascript");
+
 const validJS = `
 import _ from "underscore";
 import SearchInputModel from "search-input-model";
@@ -96,25 +99,13 @@ let a;
 something = 1;
 `;
 
-const invalidES5 = `
-function test() {
-  var a = [
-    1,
-    2,
-  ];
-  a.push(arguments.callee);
-  var b = {};
-  b.__defineGetter__('tom', test);
-}
-`;
-
 describe("flags no warnings with valid js", () => {
   let eslint, results;
 
   beforeEach(() => {
     eslint = new ESLint({
-      useEslintrc: false,
-      overrideConfigFile: "__tests__/.eslintrc-index",
+      baseConfig: pvESLintJS,
+      overrideConfigFile: true,
     });
   });
 
@@ -129,34 +120,13 @@ describe("flags no warnings with valid js", () => {
   });
 });
 
-describe("handles legacy JS", () => {
-  let eslint, results;
-
-  beforeEach(() => {
-    eslint = new ESLint({
-      useEslintrc: false,
-      overrideConfigFile: "__tests__/.eslintrc-legacy",
-    });
-  });
-
-  it("doesn't parse ES6", async () => {
-    results = await eslint.lintText(validJS);
-    expect(results[0].errorCount).toBe(1);
-  });
-
-  it("follows legacy rules", async () => {
-    results = await eslint.lintText(invalidES5);
-    expect(results[0].errorCount).toBe(7);
-  });
-});
-
 describe("flags warnings with invalid js", () => {
   let eslint, results;
 
   beforeEach(() => {
     eslint = new ESLint({
-      useEslintrc: false,
-      overrideConfigFile: "__tests__/.eslintrc-index",
+      baseConfig: pvESLintJS,
+      overrideConfigFile: true,
     });
   });