@viclafouch/eslint-config-viclafouch 3.9.2 → 3.9.3-beta.1

package/.eslintrc

@@ -0,0 +1,10 @@
+{
+  "extends": ["./index.js", "./prettier"],
+  "root": true,
+  "rules": {
+    // disable requiring trailing commas because it might be nice to revert to
+    // being JSON at some point, and I don't want to make big changes now.
+    "comma-dangle": 0,
+    "max-len": 0
+  }
+}

package/README.md

@@ -1,8 +1,6 @@
-[![npm version](https://badge.fury.io/js/%40viclafouch%2Feslint-config-viclafouch.svg)](https://badge.fury.io/js/%40viclafouch%2Feslint-config-viclafouch)
-
 # Eslint / Prettier Setup of @viclafouch 📦
 
-These are my ESLint and Prettier settings for a React.js project ⚡️
+These are the ESLint and Prettier settings for a Next.js project ⚡️
 
 
 # Table of Contents
@@ -14,13 +12,19 @@ These are my ESLint and Prettier settings for a React.js project ⚡️
   - [If you use JavaScript](#if-you-use-javascript)
     - [Scripts](#scripts)
   - [If you use TypeScript](#if-you-use-typescript)
+    - [Extend your tsconfig](#extend-your-tsconfig)
+    - [Better typing](#better-typing)
     - [Scripts](#scripts-1)
-  - [With VS Code](#with-vs-code)
-  - [With Create React App](#with-create-react-app)
+  - [If you use Next.js](#if-you-use-nextjs)
+  - [If you use React.js](#if-you-use-reactjs)
+  - [If you want to use Prettier](#if-you-want-to-use-prettier)
+  - [If you use VS Code](#if-you-use-vs-code)
 
 ## What it does
 
-* Lints JavaScript based on the latest standards
+* Lints JavaScript / TypeScript based on the latest standards
+* Multiple configs `react` `hooks` `next`..
+* Shared `tsconfig.json`
 * Fixes issues and formatting errors with Prettier
 * Check for accessibility rules on JSX elements.
 
@@ -38,7 +42,7 @@ npx install-peerdeps --dev @viclafouch/eslint-config-viclafouch
 
 4. Create a `.eslintrc` file in the root of your project's directory (it should live where package.json does). Your `.eslintrc` file should look like this:
 
-## If you use JavaScript
+5. Extends your config with the minimal base of Frichti config :
 
 ```json
 {
@@ -48,14 +52,18 @@ npx install-peerdeps --dev @viclafouch/eslint-config-viclafouch
 }
 ```
 
-Then, you can remove these unnecessary packages (you don't need the TypeScript support)
+## If you use JavaScript
+
+You can remove these unnecessary packages (you don't need the TypeScript support)
 
 ```diff
-"devDependencies": {
-- "@typescript-eslint/eslint-plugin": "5.4.0",
-- "@typescript-eslint/parser": "5.4.0",
-- "typescript": "4.5.2"
-},
+{
+  "devDependencies": {
+- "@typescript-eslint/eslint-plugin": "xxx",
+- "@typescript-eslint/parser": "xxx",
+- "typescript": "xxx"
+  }
+}
 ```
 
 ### Scripts
@@ -63,47 +71,125 @@ Then, you can remove these unnecessary packages (you don't need the TypeScript s
 You can add two scripts to your package.json to lint and/or fix your code:
 
 ```json
-"scripts": {
-  "lint": "eslint .",
-  "lint:fix": "npm run lint -- --fix",
-},
+{
+  "scripts": {
+    "lint": "eslint .",
+    "lint:fix": "npm run lint -- --fix",
+  }
+}
 ```
 ## If you use TypeScript
 
+### Extend your tsconfig
+
+First, extend your current config file `tsconfig.json` with this following snippet:
+
 ```json
 {
-  "extends": [
-    "@viclafouch/eslint-config-viclafouch/typescript"
+  "extends": "@viclafouch/eslint-config-viclafouch/tsconfig.json",
+  ...
+}
+```
+
+Then, add the TypeScript Eslint rules to your `.eslintrc` file:
+
+```js
+{
+  extends: [
+    '@viclafouch/eslint-config-viclafouch',
+    '@viclafouch/eslint-config-viclafouch/typescript'
   ],
-  "parserOptions": {
-    "project": ["./tsconfig.json"]
-  }
+  parserOptions: {
+    project: true,
+    tsconfigRootDir: __dirname
+  },
+  root: true
 }
 ```
 
-Then, you can remove these unnecessary packages (you don't the Babel parser, we use `@typescript-eslint/parser`).
+Then, you can remove these following unnecessary packages (you don't the Babel parser, we use `@typescript-eslint/parser`) instead.
 
 
 ```diff
-"devDependencies": {
-- "@babel/core": "7.16.0",
-- "@babel/eslint-parser": "7.16.3"
-...
-},
+{
+  "devDependencies": {
+- "@babel/core": "xxx",
+- "@babel/eslint-parser": "xxx"
+  ...
+  }
+}
 ```
 
+### Better typing
+
+TypeScript's built-in typings are not perfect. frichti-reset makes them better.
+
+1. Create a `reset.d.ts` file in your project with these contents:
+
+```ts
+// Do not add any other lines of code to this file!
+import '@viclafouch/eslint-config-viclafouch/reset.d'
+```
+
+2. Enjoy improved typings across your entire project.
+
 ### Scripts
 
 You can add two scripts to your package.json to lint and/or fix your code:
 
 ```json
-"scripts": {
-  "lint": "tsc --noEmit && eslint . --ext .js,.jsx,.ts,.tsx",
-  "lint:fix": "npm run lint -- --fix",
-},
+{
+  "scripts": {
+    "lint": "tsc --noEmit && eslint . --ext .js,.jsx,.ts,.tsx",
+    "lint:fix": "npm run lint -- --fix",
+  },
+}
 ```
 
-## With VS Code
+## If you use Next.js
+
+You can also add additional rules for Next.js. It includes the following configurations : `@viclafouch/eslint-config-viclafouch/react`, `@viclafouch/eslint-config-viclafouch/hooks` and Next.js specific rules.
+
+```js
+{
+  extends: [
+    '@viclafouch/eslint-config-viclafouch',
+    '@viclafouch/eslint-config-viclafouch/next'
+  ],
+}
+```
+
+## If you use React.js
+
+You can also add additional rules for only React.js ecosystem (without Next.js).
+
+```js
+{
+  extends: [
+    '@viclafouch/eslint-config-viclafouch',
+    '@viclafouch/eslint-config-viclafouch/react',
+    '@viclafouch/eslint-config-viclafouch/hooks'
+  ],
+}
+```
+
+
+## If you want to use Prettier
+
+Be sure to add the prettier config at the end of your `extends` array.
+
+```js
+{
+  extends: [
+    '@viclafouch/eslint-config-viclafouch',
+    '@viclafouch/eslint-config-viclafouch/react',
+    '@viclafouch/eslint-config-viclafouch/hooks',
+    '@viclafouch/eslint-config-viclafouch/prettier' // be sure to be the last
+  ],
+}
+```
+
+## If you use VS Code
 
 Once you have done. You probably want your editor to lint and fix for you.
 
@@ -116,10 +202,4 @@ Once you have done. You probably want your editor to lint and fix for you.
     "source.fixAll.eslint": true
   }
 }
-```
-
-## With Create React App
-
-1. You gotta eject first `npm run eject` or `yarn eject`
-1. Run `npx install-peerdeps --dev @viclafouch/eslint-config-viclafouch`
-1. Crack open your `package.json` and replace `"extends": "react-app"` with `"extends": ["@viclafouch/eslint-config-viclafouch"]`
+```

package/hooks.js

@@ -0,0 +1,7 @@
+/**
+ * @type {import("eslint").Linter.Config}
+ */
+module.exports = {
+  extends: ['./rules/react-hooks.js'].map(require.resolve),
+  rules: {}
+}

package/index.js

@@ -1,3 +1,19 @@
-const eslintrc = require('./.eslintrc')
-
-module.exports = eslintrc
+/**
+ * @type {import("eslint").Linter.Config}
+ */
+module.exports = {
+  extends: [
+    './rules/best-practices',
+    './rules/node',
+    './rules/errors',
+    './rules/imports',
+    './rules/style',
+    './rules/variables',
+    './rules/es6'
+  ].map(require.resolve),
+  parserOptions: {
+    ecmaVersion: 2022,
+    sourceType: 'module'
+  },
+  rules: {}
+}

package/next.js

@@ -0,0 +1,19 @@
+/**
+ * @type {import("eslint").Linter.Config}
+ */
+module.exports = {
+  extends: ['./react.js', './hooks.js']
+    .map(require.resolve)
+    .concat(['plugin:@next/next/recommended']),
+  rules: {
+    // No error for anchor inside a Next Link
+    'jsx-a11y/anchor-is-valid': [
+      'error',
+      {
+        components: ['Link'],
+        specialLink: ['hrefLeft', 'hrefRight'],
+        aspects: ['invalidHref', 'preferButton']
+      }
+    ]
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viclafouch/eslint-config-viclafouch",
-  "version": "3.9.2",
+  "version": "3.9.3-beta.1",
   "description": "ESLint and Prettier Config from Victor de la Fouchardiere",
   "main": "index.js",
   "keywords": [
@@ -24,33 +24,18 @@
   "license": "MIT",
   "homepage": "https://github.com/viclafouch/eslint-config-viclafouch#readme",
   "peerDependencies": {
-    "@babel/core": "^7.21.5",
-    "@babel/eslint-parser": "^7.21.3",
-    "@typescript-eslint/eslint-plugin": "^5.59.1",
-    "@typescript-eslint/parser": "^5.59.1",
     "eslint": "^8.39.0",
-    "eslint-config-airbnb": "^19.0.4",
-    "eslint-config-airbnb-typescript": "^17.0.0",
-    "eslint-config-prettier": "^8.8.0",
-    "eslint-plugin-import": "^2.27.5",
-    "eslint-plugin-jsx-a11y": "^6.7.1",
-    "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-promise": "^6.1.1",
-    "eslint-plugin-react": "^7.32.2",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "eslint-plugin-simple-import-sort": "^10.0.0",
     "prettier": "^2.8.8",
-    "standard-version": "9.5.0",
-    "typescript": "^5.0.4"
+    "typescript": "^5.1.6"
   },
   "devDependencies": {
-    "@babel/core": "^7.21.5",
-    "@babel/eslint-parser": "^7.21.3",
-    "@typescript-eslint/eslint-plugin": "^5.59.1",
-    "@typescript-eslint/parser": "^5.59.1",
-    "eslint": "^8.39.0",
-    "eslint-config-airbnb": "^19.0.4",
-    "eslint-config-airbnb-typescript": "^17.0.0",
+    "@babel/core": "^7.22.5",
+    "@babel/eslint-parser": "^7.22.5",
+    "@next/eslint-plugin-next": "^13.4.7",
+    "@typescript-eslint/eslint-plugin": "^5.60.1",
+    "@typescript-eslint/parser": "^5.60.1",
+    "babel-loader": "^9.1.2",
+    "eslint": "^8.44.0",
     "eslint-config-prettier": "^8.8.0",
     "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-jsx-a11y": "^6.7.1",
@@ -59,13 +44,18 @@
     "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-simple-import-sort": "^10.0.0",
+    "eslint-plugin-testing-library": "^5.11.0",
     "prettier": "^2.8.8",
-    "standard-version": "9.5.0",
-    "typescript": "^5.0.4"
+    "typescript": "^5.1.6"
+  },
+  "dependencies": {
+    "@total-typescript/ts-reset": "^0.4.2",
+    "get-tsconfig": "^4.6.2"
   },
   "scripts": {
     "lint": "eslint .",
     "lint:fix": "eslint --fix",
-    "release": "standard-version"
+    "bump:beta": "npm version prerelease --preid beta",
+    "publish:beta": "npm publish --tag beta"
   }
 }

package/prettier.js

@@ -0,0 +1,23 @@
+/**
+ * @type {import("eslint").Linter.Config}
+ */
+module.exports = {
+  extends: ['prettier'],
+  plugins: ['prettier'],
+  rules: {
+    'prettier/prettier': [
+      'error',
+      {
+        semi: false,
+        singleQuote: true,
+        printWidth: 80,
+        tabWidth: 2,
+        jsxSingleQuote: false,
+        trailingComma: 'none',
+        endOfLine: 'auto',
+        bracketSameLine: false,
+        arrowParens: 'always'
+      }
+    ]
+  }
+}

package/react.js

@@ -0,0 +1,7 @@
+/**
+ * @type {import("eslint").Linter.Config}
+ */
+module.exports = {
+  extends: ['./rules/react.js'].map(require.resolve),
+  rules: {}
+}

package/reset.d.ts

@@ -0,0 +1 @@
+export * from '@total-typescript/ts-reset'