@viclafouch/eslint-config-viclafouch 3.2.0 → 3.3.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.eslintrc-base.js +62 -0
- package/.eslintrc.js +5 -65
- package/README.md +62 -3
- package/package.json +22 -10
- package/typescript.js +16 -0
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
module.exports = {
|
|
2
|
+
plugins: ['react', 'simple-import-sort'],
|
|
3
|
+
env: {
|
|
4
|
+
browser: true,
|
|
5
|
+
es6: true,
|
|
6
|
+
node: true
|
|
7
|
+
},
|
|
8
|
+
settings: {
|
|
9
|
+
react: {
|
|
10
|
+
version: 'detect'
|
|
11
|
+
}
|
|
12
|
+
},
|
|
13
|
+
rules: {
|
|
14
|
+
'react/prop-types': 'off',
|
|
15
|
+
'simple-import-sort/imports': 'error',
|
|
16
|
+
'react/jsx-props-no-spreading': 0,
|
|
17
|
+
'import/prefer-default-export': 0,
|
|
18
|
+
'arrow-body-style': ['error', 'always'],
|
|
19
|
+
'react/function-component-definition': [
|
|
20
|
+
2,
|
|
21
|
+
{ namedComponents: 'arrow-function' }
|
|
22
|
+
],
|
|
23
|
+
'prettier/prettier': [
|
|
24
|
+
'error',
|
|
25
|
+
{
|
|
26
|
+
semi: false,
|
|
27
|
+
singleQuote: true,
|
|
28
|
+
printWidth: 80,
|
|
29
|
+
tabWidth: 2,
|
|
30
|
+
jsxSingleQuote: false,
|
|
31
|
+
trailingComma: 'none',
|
|
32
|
+
endOfLine: 'auto',
|
|
33
|
+
bracketSameLine: false,
|
|
34
|
+
arrowParens: 'always'
|
|
35
|
+
}
|
|
36
|
+
]
|
|
37
|
+
},
|
|
38
|
+
overrides: [
|
|
39
|
+
{
|
|
40
|
+
files: ['*.jsx', '*.js', '*.ts', '*.tsx'],
|
|
41
|
+
rules: {
|
|
42
|
+
'simple-import-sort/imports': [
|
|
43
|
+
'error',
|
|
44
|
+
{
|
|
45
|
+
groups: [
|
|
46
|
+
// Packages. `react` related packages come first.
|
|
47
|
+
// Things that start with a letter (or digit or underscore), or `@` followed by a letter.
|
|
48
|
+
['^react', '^next', '^@mui(/.*|$)', '^@?\\w'],
|
|
49
|
+
// Absolute imports and Relative imports.
|
|
50
|
+
[
|
|
51
|
+
'^(utils|services|hooks|hoc|types|contexts|dictionary|components)(/.*|$)',
|
|
52
|
+
'^\\.'
|
|
53
|
+
],
|
|
54
|
+
// for scss imports.
|
|
55
|
+
['^[^.]']
|
|
56
|
+
]
|
|
57
|
+
}
|
|
58
|
+
]
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
]
|
|
62
|
+
}
|
package/.eslintrc.js
CHANGED
|
@@ -1,23 +1,11 @@
|
|
|
1
1
|
module.exports = {
|
|
2
|
-
plugins: ['react', 'simple-import-sort'],
|
|
3
2
|
extends: [
|
|
4
|
-
'
|
|
5
|
-
'
|
|
6
|
-
'plugin:
|
|
7
|
-
'
|
|
8
|
-
'plugin:prettier/recommended'
|
|
3
|
+
'airbnb',
|
|
4
|
+
'airbnb/hooks',
|
|
5
|
+
'plugin:prettier/recommended',
|
|
6
|
+
'./.eslintrc-base.js'
|
|
9
7
|
],
|
|
10
|
-
env: {
|
|
11
|
-
browser: true,
|
|
12
|
-
es6: true,
|
|
13
|
-
node: true
|
|
14
|
-
},
|
|
15
8
|
parser: '@babel/eslint-parser',
|
|
16
|
-
settings: {
|
|
17
|
-
react: {
|
|
18
|
-
version: 'detect'
|
|
19
|
-
}
|
|
20
|
-
},
|
|
21
9
|
parserOptions: {
|
|
22
10
|
requireConfigFile: false,
|
|
23
11
|
ecmaVersion: 'latest',
|
|
@@ -25,53 +13,5 @@ module.exports = {
|
|
|
25
13
|
ecmaFeatures: {
|
|
26
14
|
jsx: true
|
|
27
15
|
}
|
|
28
|
-
}
|
|
29
|
-
rules: {
|
|
30
|
-
'react/prop-types': 'off',
|
|
31
|
-
'simple-import-sort/imports': 'error',
|
|
32
|
-
'react/jsx-props-no-spreading': 0,
|
|
33
|
-
'arrow-body-style': ['error', 'always'],
|
|
34
|
-
'react/function-component-definition': [
|
|
35
|
-
2,
|
|
36
|
-
{ namedComponents: 'arrow-function' }
|
|
37
|
-
],
|
|
38
|
-
'prettier/prettier': [
|
|
39
|
-
'error',
|
|
40
|
-
{
|
|
41
|
-
semi: false,
|
|
42
|
-
singleQuote: true,
|
|
43
|
-
printWidth: 80,
|
|
44
|
-
tabWidth: 2,
|
|
45
|
-
jsxSingleQuote: false,
|
|
46
|
-
trailingComma: 'none',
|
|
47
|
-
endOfLine: 'auto',
|
|
48
|
-
bracketSameLine: false,
|
|
49
|
-
arrowParens: 'always'
|
|
50
|
-
}
|
|
51
|
-
]
|
|
52
|
-
},
|
|
53
|
-
overrides: [
|
|
54
|
-
{
|
|
55
|
-
files: ['*.jsx', '*.js'],
|
|
56
|
-
rules: {
|
|
57
|
-
'simple-import-sort/imports': [
|
|
58
|
-
'error',
|
|
59
|
-
{
|
|
60
|
-
groups: [
|
|
61
|
-
// Packages. `react` related packages come first.
|
|
62
|
-
// Things that start with a letter (or digit or underscore), or `@` followed by a letter.
|
|
63
|
-
['^react', '^next', '^@?\\w'],
|
|
64
|
-
// Absolute imports and Relative imports.
|
|
65
|
-
[
|
|
66
|
-
'^(utils|services|hooks|hoc|types|contexts|dictionary|components)(/.*|$)',
|
|
67
|
-
'^\\.'
|
|
68
|
-
],
|
|
69
|
-
// for scss imports.
|
|
70
|
-
['^[^.]']
|
|
71
|
-
]
|
|
72
|
-
}
|
|
73
|
-
]
|
|
74
|
-
}
|
|
75
|
-
}
|
|
76
|
-
]
|
|
16
|
+
}
|
|
77
17
|
}
|
package/README.md
CHANGED
|
@@ -4,6 +4,20 @@
|
|
|
4
4
|
|
|
5
5
|
These are my ESLint and Prettier settings for a React.js project ⚡️
|
|
6
6
|
|
|
7
|
+
|
|
8
|
+
# Table of Contents
|
|
9
|
+
|
|
10
|
+
- [Eslint / Prettier Setup of @viclafouch 📦](#eslint--prettier-setup-of-viclafouch-)
|
|
11
|
+
- [Table of Contents](#table-of-contents)
|
|
12
|
+
- [What it does](#what-it-does)
|
|
13
|
+
- [Local / Per Project Install](#local--per-project-install)
|
|
14
|
+
- [If you use JavaScript](#if-you-use-javascript)
|
|
15
|
+
- [Scripts](#scripts)
|
|
16
|
+
- [If you use TypeScript](#if-you-use-typescript)
|
|
17
|
+
- [Scripts](#scripts-1)
|
|
18
|
+
- [With VS Code](#with-vs-code)
|
|
19
|
+
- [With Create React App](#with-create-react-app)
|
|
20
|
+
|
|
7
21
|
## What it does
|
|
8
22
|
|
|
9
23
|
* Lints JavaScript based on the latest standards
|
|
@@ -24,6 +38,8 @@ npx install-peerdeps --dev @viclafouch/eslint-config-viclafouch
|
|
|
24
38
|
|
|
25
39
|
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:
|
|
26
40
|
|
|
41
|
+
## If you use JavaScript
|
|
42
|
+
|
|
27
43
|
```json
|
|
28
44
|
{
|
|
29
45
|
"extends": [
|
|
@@ -32,12 +48,55 @@ npx install-peerdeps --dev @viclafouch/eslint-config-viclafouch
|
|
|
32
48
|
}
|
|
33
49
|
```
|
|
34
50
|
|
|
35
|
-
|
|
51
|
+
Then, you can remove these unnecessary packages (you don't need the TypeScript support)
|
|
52
|
+
|
|
53
|
+
```diff
|
|
54
|
+
"devDependencies": {
|
|
55
|
+
- "@typescript-eslint/eslint-plugin": "5.4.0",
|
|
56
|
+
- "@typescript-eslint/parser": "5.4.0",
|
|
57
|
+
- "typescript": "4.5.2"
|
|
58
|
+
},
|
|
59
|
+
```
|
|
60
|
+
|
|
61
|
+
### Scripts
|
|
62
|
+
|
|
63
|
+
You can add two scripts to your package.json to lint and/or fix your code:
|
|
36
64
|
|
|
37
65
|
```json
|
|
38
66
|
"scripts": {
|
|
39
67
|
"lint": "eslint .",
|
|
40
|
-
"lint:fix": "
|
|
68
|
+
"lint:fix": "npm run lint -- --fix",
|
|
69
|
+
},
|
|
70
|
+
```
|
|
71
|
+
## If you use TypeScript
|
|
72
|
+
|
|
73
|
+
```json
|
|
74
|
+
{
|
|
75
|
+
"extends": [
|
|
76
|
+
"@viclafouch/eslint-config-viclafouch/typescript"
|
|
77
|
+
]
|
|
78
|
+
}
|
|
79
|
+
```
|
|
80
|
+
|
|
81
|
+
Then, you can remove these unnecessary packages (you don't the Babel parser, we use `@typescript-eslint/parser`).
|
|
82
|
+
|
|
83
|
+
|
|
84
|
+
```diff
|
|
85
|
+
"devDependencies": {
|
|
86
|
+
- "@babel/core": "7.16.0",
|
|
87
|
+
- "@babel/eslint-parser": "7.16.3"
|
|
88
|
+
...
|
|
89
|
+
},
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
### Scripts
|
|
93
|
+
|
|
94
|
+
You can add two scripts to your package.json to lint and/or fix your code:
|
|
95
|
+
|
|
96
|
+
```json
|
|
97
|
+
"scripts": {
|
|
98
|
+
"lint": "tsc --noEmit && eslint . --ext .js,.jsx,.ts,.tsx",
|
|
99
|
+
"lint:fix": "npm run lint -- --fix",
|
|
41
100
|
},
|
|
42
101
|
```
|
|
43
102
|
|
|
@@ -46,7 +105,7 @@ npx install-peerdeps --dev @viclafouch/eslint-config-viclafouch
|
|
|
46
105
|
Once you have done. You probably want your editor to lint and fix for you.
|
|
47
106
|
|
|
48
107
|
1. Install the [ESLint package](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
|
|
49
|
-
2. Now we need to setup some VS Code settings
|
|
108
|
+
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:
|
|
50
109
|
|
|
51
110
|
```js
|
|
52
111
|
{
|
package/package.json
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@viclafouch/eslint-config-viclafouch",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.3.3",
|
|
4
4
|
"description": "ESLint and Prettier Config from Victor de la Fouchardiere",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"javascript",
|
|
8
8
|
"ecmascript",
|
|
9
|
+
"typescript",
|
|
9
10
|
"eslint",
|
|
10
|
-
"lint",
|
|
11
11
|
"config",
|
|
12
12
|
"prettier"
|
|
13
13
|
],
|
|
@@ -26,27 +26,39 @@
|
|
|
26
26
|
"peerDependencies": {
|
|
27
27
|
"@babel/core": "7.16.0",
|
|
28
28
|
"@babel/eslint-parser": "7.16.3",
|
|
29
|
+
"@typescript-eslint/eslint-plugin": "5.4.0",
|
|
30
|
+
"@typescript-eslint/parser": "5.4.0",
|
|
29
31
|
"eslint": "8.3.0",
|
|
32
|
+
"eslint-config-airbnb": "19.0.1",
|
|
33
|
+
"eslint-config-airbnb-typescript": "16.0.0",
|
|
30
34
|
"eslint-config-prettier": "^8.3.0",
|
|
31
|
-
"eslint-plugin-
|
|
35
|
+
"eslint-plugin-import": "2.25.3",
|
|
36
|
+
"eslint-plugin-jsx-a11y": "6.5.1",
|
|
32
37
|
"eslint-plugin-prettier": "^4.0.0",
|
|
33
|
-
"eslint-plugin-react": "
|
|
34
|
-
"eslint-plugin-react-hooks": "
|
|
38
|
+
"eslint-plugin-react": "7.27.1",
|
|
39
|
+
"eslint-plugin-react-hooks": "4.3.0",
|
|
35
40
|
"eslint-plugin-simple-import-sort": "^7.0.0",
|
|
36
|
-
"prettier": "^2.5.0"
|
|
41
|
+
"prettier": "^2.5.0",
|
|
42
|
+
"typescript": "4.5.2"
|
|
37
43
|
},
|
|
38
44
|
"devDependencies": {
|
|
39
45
|
"@babel/core": "7.16.0",
|
|
40
46
|
"@babel/eslint-parser": "7.16.3",
|
|
47
|
+
"@typescript-eslint/eslint-plugin": "5.4.0",
|
|
48
|
+
"@typescript-eslint/parser": "5.4.0",
|
|
41
49
|
"eslint": "8.3.0",
|
|
50
|
+
"eslint-config-airbnb": "19.0.1",
|
|
51
|
+
"eslint-config-airbnb-typescript": "16.0.0",
|
|
42
52
|
"eslint-config-prettier": "^8.3.0",
|
|
43
|
-
"eslint-plugin-
|
|
53
|
+
"eslint-plugin-import": "2.25.3",
|
|
54
|
+
"eslint-plugin-jsx-a11y": "6.5.1",
|
|
44
55
|
"eslint-plugin-prettier": "^4.0.0",
|
|
45
|
-
"eslint-plugin-react": "
|
|
46
|
-
"eslint-plugin-react-hooks": "
|
|
56
|
+
"eslint-plugin-react": "7.27.1",
|
|
57
|
+
"eslint-plugin-react-hooks": "4.3.0",
|
|
47
58
|
"eslint-plugin-simple-import-sort": "^7.0.0",
|
|
48
59
|
"prettier": "^2.5.0",
|
|
49
|
-
"standard-version": "9.3.2"
|
|
60
|
+
"standard-version": "9.3.2",
|
|
61
|
+
"typescript": "4.5.2"
|
|
50
62
|
},
|
|
51
63
|
"scripts": {
|
|
52
64
|
"lint": "eslint .",
|
package/typescript.js
ADDED
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
module.exports = {
|
|
2
|
+
extends: [
|
|
3
|
+
'airbnb',
|
|
4
|
+
'airbnb-typescript',
|
|
5
|
+
'airbnb/hooks',
|
|
6
|
+
'plugin:@typescript-eslint/recommended',
|
|
7
|
+
'plugin:prettier/recommended',
|
|
8
|
+
'./.eslintrc-base.js'
|
|
9
|
+
],
|
|
10
|
+
parser: '@typescript-eslint/parser',
|
|
11
|
+
plugins: ['react', '@typescript-eslint', 'simple-import-sort'],
|
|
12
|
+
rules: {
|
|
13
|
+
'@typescript-eslint/ban-ts-comment': 'off',
|
|
14
|
+
'react/jsx-filename-extension': [1, { extensions: ['.ts', '.tsx'] }]
|
|
15
|
+
}
|
|
16
|
+
}
|