@viclafouch/eslint-config-viclafouch 3.3.0 → 3.3.1

package/.eslintrc.js

@@ -2,9 +2,8 @@ module.exports = {
   plugins: ['react', 'simple-import-sort'],
   extends: [
     'eslint:recommended',
-    'plugin:react/recommended',
-    'plugin:react-hooks/recommended',
-    'plugin:jsx-a11y/recommended',
+    'airbnb',
+    'airbnb/hooks',
     'plugin:prettier/recommended'
   ],
   env: {

package/README.md

@@ -4,6 +4,20 @@
 
 These are my ESLint and Prettier settings for a React.js project ⚡️
 
+
+# Table of Contents
+
+- [Eslint / Prettier Setup of @viclafouch 📦](#eslint--prettier-setup-of-viclafouch-)
+- [Table of Contents](#table-of-contents)
+  - [What it does](#what-it-does)
+  - [Local / Per Project Install](#local--per-project-install)
+  - [If you use JavaScript](#if-you-use-javascript)
+    - [Scripts](#scripts)
+  - [If you use TypeScript](#if-you-use-typescript)
+    - [Scripts](#scripts-1)
+  - [With VS Code](#with-vs-code)
+  - [With Create React App](#with-create-react-app)
+
 ## What it does
 
 * Lints JavaScript based on the latest standards
@@ -24,6 +38,8 @@ 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
+
 ```json
 {
   "extends": [
@@ -32,12 +48,55 @@ npx install-peerdeps --dev @viclafouch/eslint-config-viclafouch
 }
 ```
 
-5. You can add two scripts to your package.json to lint and/or fix:
+Then, 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"
+},
+```
+
+### Scripts
+
+You can add two scripts to your package.json to lint and/or fix your code:
 
 ```json
 "scripts": {
   "lint": "eslint .",
-  "lint:fix": "eslint . --fix"
+  "lint:fix": "npm run lint -- --fix",
+},
+```
+## If you use TypeScript
+
+```json
+{
+  "extends": [
+    "@viclafouch/eslint-config-viclafouch/typescript"
+  ]
+}
+```
+
+Then, you can remove these unnecessary packages (you don't the Babel parser, we use `@typescript-eslint/parser`).
+
+
+```diff
+"devDependencies": {
+- "@babel/core": "7.16.0",
+- "@babel/eslint-parser": "7.16.3"
+...
+},
+```
+
+### 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",
 },
 ```
 
@@ -46,7 +105,7 @@ npx install-peerdeps --dev @viclafouch/eslint-config-viclafouch
 Once you have done. You probably want your editor to lint and fix for you.
 
 1. Install the [ESLint package](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
-2. Now we need to setup some VS Code settings via `Code/File` → `Preferences` → `Settings`. Click to the `{}` icon in the top right corner and add this :
+2. Now we need to setup some VS Code settings. Create a `.vscode` folder at your root project, and create a `settings.json` file in this folder. Then, add this little config:
 
 ```js
 {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viclafouch/eslint-config-viclafouch",
-  "version": "3.3.0",
+  "version": "3.3.1",
   "description": "ESLint and Prettier Config from Victor de la Fouchardiere",
   "main": "index.js",
   "keywords": [

package/typescript.js

@@ -2,17 +2,12 @@ module.exports = {
   extends: [
     'airbnb',
     'airbnb-typescript',
-    'airbnb/hooks',
     'plugin:@typescript-eslint/recommended',
-    'plugin:prettier/recommended',
     './.eslintrc.js'
   ],
   parser: '@typescript-eslint/parser',
   plugins: ['react', '@typescript-eslint', 'simple-import-sort'],
   rules: {
     '@typescript-eslint/ban-ts-comment': 'off'
-  },
-  parserOptions: {
-    project: './tsconfig.json'
   }
 }