Skip to content

Commit 805a726

Browse files
aklassenaklassen
committed
setup eslint and prettier
1 parent cf2afeb commit 805a726

15 files changed

+1442
-60
lines changed

‎.eslintignore

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
node_modules
2+
.DS_Store
3+
dist
4+
dist-ssr
5+
*.local
6+
node_modules/*

‎.eslintrc.js

+53
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
module.exports = {
2+
root: true,
3+
parser: '@typescript-eslint/parser',
4+
parserOptions: {
5+
ecmaVersion: 2020,
6+
sourceType: 'module',
7+
ecmaFeatures: {
8+
jsx: true,
9+
},
10+
},
11+
settings: {
12+
react: {
13+
version: 'detect',
14+
},
15+
'import/resolver': {
16+
node: {
17+
paths: ['src'],
18+
extensions: ['.js', '.jsx', '.ts', '.tsx'],
19+
},
20+
},
21+
},
22+
env: {
23+
browser: true,
24+
amd: true,
25+
node: true,
26+
},
27+
extends: [
28+
'eslint:recommended',
29+
'plugin:react/recommended',
30+
'plugin:jsx-a11y/recommended',
31+
'plugin:testing-library/react',
32+
'plugin:jest/recommended',
33+
'plugin:prettier/recommended', // Make sure this is always the last element in the array.
34+
],
35+
plugins: ['simple-import-sort', 'prettier', 'testing-library', 'jest'],
36+
rules: {
37+
'prettier/prettier': ['error', {}, { usePrettierrc: true }],
38+
'react/react-in-jsx-scope': 'off',
39+
'jsx-a11y/accessible-emoji': 'off',
40+
'react/prop-types': 'off',
41+
'@typescript-eslint/explicit-function-return-type': 'off',
42+
'simple-import-sort/imports': 'error',
43+
'simple-import-sort/exports': 'error',
44+
'jsx-a11y/anchor-is-valid': [
45+
'error',
46+
{
47+
components: ['Link'],
48+
specialLink: ['hrefLeft', 'hrefRight'],
49+
aspects: ['invalidHref', 'preferButton'],
50+
},
51+
],
52+
},
53+
};

‎.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -3,3 +3,4 @@ node_modules
33
dist
44
dist-ssr
55
*.local
6+
.vscode/settings.json

‎.prettierignore

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
node_modules
2+
.DS_Store
3+
dist
4+
dist-ssr
5+
*.local
6+
node_modules/*

‎.prettierrc.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
module.exports = {
2+
semi: true,
3+
trailingComma: 'all',
4+
singleQuote: true,
5+
printWidth: 90,
6+
tabWidth: 2,
7+
endOfLine: 'auto',
8+
};

‎jest.config.js

+7-7
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
module.exports = {
2-
preset: "vite-jest",
2+
preset: 'vite-jest',
33

4-
setupFilesAfterEnv: ["<rootDir>/jest.setup.js"],
4+
setupFilesAfterEnv: ['<rootDir>/jest.setup.js'],
55
testMatch: [
6-
"<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}",
7-
"<rootDir>/src/**/*.{spec,test}.{js,jsx,ts,tsx}",
6+
'<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}',
7+
'<rootDir>/src/**/*.{spec,test}.{js,jsx,ts,tsx}',
88
],
9-
testEnvironment: "jest-environment-jsdom",
9+
testEnvironment: 'jest-environment-jsdom',
1010
moduleNameMapper: {
11-
"\\.(css|sass|scss)$": "identity-obj-proxy",
11+
'\\.(css|sass|scss)$': 'identity-obj-proxy',
1212
},
13-
};
13+
};

‎jest.setup.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,4 @@
22
// allows you to do things like:
33
// expect(element).toHaveTextContent(/react/i)
44
// learn more: https://github.com/testing-library/jest-dom
5-
require("@testing-library/jest-dom");
5+
require('@testing-library/jest-dom');

‎package.json

+20-2
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,11 @@
55
"dev": "vite",
66
"build": "tsc && vite build",
77
"preview": "vite preview",
8-
"test:unit": "vite-jest --no-cache"
8+
"test:unit": "vite-jest --no-cache",
9+
"lint:fix": "eslint ./src --ext .jsx,.js,.ts,.tsx --quiet --fix --ignore-path ./.gitignore",
10+
"lint:format": "prettier --loglevel warn --write \"./**/*.{js,jsx,ts,tsx,css,md,json}\" ",
11+
"lint": "yarn lint:format && yarn lint:fix ",
12+
"type-check": "tsc"
913
},
1014
"dependencies": {
1115
"@testing-library/jest-dom": "^5.16.1",
@@ -17,12 +21,26 @@
1721
"devDependencies": {
1822
"@types/react": "^17.0.33",
1923
"@types/react-dom": "^17.0.10",
24+
"@typescript-eslint/eslint-plugin": "^5.10.1",
25+
"@typescript-eslint/parser": "^5.10.1",
2026
"@vitejs/plugin-react": "^1.0.7",
27+
"eslint": "^8.7.0",
28+
"eslint-config-prettier": "^8.3.0",
29+
"eslint-plugin-import": "^2.25.4",
30+
"eslint-plugin-jest": "^26.0.0",
31+
"eslint-plugin-jsx-a11y": "^6.5.1",
32+
"eslint-plugin-prettier": "^4.0.0",
33+
"eslint-plugin-react": "^7.28.0",
34+
"eslint-plugin-simple-import-sort": "^7.0.0",
35+
"eslint-plugin-testing-library": "^5.0.4",
2136
"identity-obj-proxy": "^3.0.0",
2237
"jest": "^27.4.7",
2338
"jest-environment-jsdom": "^27.4.6",
39+
"pre-commit": "^1.2.2",
40+
"prettier": "^2.5.1",
2441
"typescript": "^4.4.4",
2542
"vite": "^2.7.2",
2643
"vite-jest": "^0.1.4"
27-
}
44+
},
45+
"pre-commit": "lint"
2846
}

‎src/App.spec.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1+
import { render, screen } from '@testing-library/react';
12
import React from 'react';
23

3-
import { render, screen } from '@testing-library/react';
44
import App from './App';
55

66
test('renders learn react link', () => {
77
render(<App />);
88
const linkElement = screen.getByText(/learn react/i);
99
expect(linkElement).toBeInTheDocument();
10-
});
10+
});

‎src/App.tsx

+8-6
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
1-
import { useState } from 'react'
2-
import logo from './logo.svg'
3-
import './App.css'
1+
import './App.css';
2+
3+
import { useState } from 'react';
4+
5+
import logo from './logo.svg';
46

57
function App() {
6-
const [count, setCount] = useState(0)
8+
const [count, setCount] = useState(0);
79

810
return (
911
<div className="App">
@@ -39,7 +41,7 @@ function App() {
3941
</p>
4042
</header>
4143
</div>
42-
)
44+
);
4345
}
4446

45-
export default App
47+
export default App;

‎src/index.css

+3-5
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,11 @@
11
body {
22
margin: 0;
3-
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
4-
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
5-
sans-serif;
3+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
4+
'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
65
-webkit-font-smoothing: antialiased;
76
-moz-osx-font-smoothing: grayscale;
87
}
98

109
code {
11-
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
12-
monospace;
10+
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
1311
}

‎src/main.tsx

+8-6
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
1-
import React from 'react'
2-
import ReactDOM from 'react-dom'
3-
import './index.css'
4-
import App from './App'
1+
import './index.css';
2+
3+
import React from 'react';
4+
import ReactDOM from 'react-dom';
5+
6+
import App from './App';
57

68
ReactDOM.render(
79
<React.StrictMode>
810
<App />
911
</React.StrictMode>,
10-
document.getElementById('root')
11-
)
12+
document.getElementById('root'),
13+
);

‎tsconfig.json

+6-10
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
"module": "ESNext",
66
"moduleResolution": "Node",
77
"strict": true,
8-
"jsx": "react",
8+
"jsx": "react-jsx",
99
"sourceMap": true,
1010
"resolveJsonModule": true,
1111
// "esModuleInterop": true,
@@ -19,19 +19,15 @@
1919
"allowSyntheticDefaultImports": true,
2020
"esModuleInterop": false,
2121
"skipLibCheck": false,
22-
"types": [
23-
"vite/client",
24-
"jest",
25-
"@types/testing-library__jest-dom",
26-
"@types/react"
27-
],
22+
"types": ["vite/client", "jest", "@types/testing-library__jest-dom", "@types/react"],
2823
"allowJs": false
2924
},
3025
"include": [
3126
"src/**/*.ts",
3227
"src/**/*.d.ts",
3328
"src/**/*.tsx",
3429
"tests/**/*.ts",
35-
"tests/**/*.tsx"
36-
, "jest.setup.js" ]
37-
}
30+
"tests/**/*.tsx",
31+
"jest.setup.js"
32+
]
33+
}

‎vite.config.ts

+6-4
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
1-
import { defineConfig } from 'vite';
21
import react from '@vitejs/plugin-react';
2+
import { defineConfig } from 'vite';
33

44
// https://vitejs.dev/config/
55
export default defineConfig({
6-
plugins: [react({
7-
fastRefresh: process.env.NODE_ENV !== 'test'
8-
})],
6+
plugins: [
7+
react({
8+
fastRefresh: process.env.NODE_ENV !== 'test',
9+
}),
10+
],
911
css: {
1012
modules: {
1113
localsConvention: 'camelCaseOnly',

0 commit comments

Comments
 (0)