npm i -D prettier
- package.json scripts:
"format": "prettier \"src/**/*.{js,html}\" --write"
touch .prettierrc
avec :{ "trailingComma": "es5" }
- Enable the option Run on save for files.
-
npm i -D eslint eslint-config-prettier babel-eslint eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks
-
package.json scripts:
"lint": "eslint \"src/**/*.{js,jsx}\""
-
touch .eslintrc.json
et y écrire :
{
"extends": [
"eslint:recommended",
"plugin:import/errors",
"plugin:react/recommended",
"plugin:jsx-a11y/recommended",
"prettier",
"prettier/react"
],
"rules": {
"react/prop-types": "off",
"no-console": "warn",
"react-hooks/rules-of-hooks": "error",
"react-hooks/exhaustive-deps": "warn"
},
"plugins": ["react", "import", "jsx-a11y", "react-hooks"],
"parser": "babel-eslint",
"parserOptions": {
"ecmaVersion": 2018,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
"env": {
"es6": true,
"browser": true,
"node": true
},
"settings": {
"react": {
"version": "detect"
}
}
}
- Automatic Eslint config
- Fix on save
node_modules
.DS_Store
.cache/
dist
coverage
.vscode
.env
.idea/
npm install -D parcel-bundler
- package.json scripts:
"dev": "parcel src/index.html"
- husky avec prettier + lint + tests
- Encapsuler toute l'application autour de React.StrictMode afin de limiter l'usage de fonctionnalités dépréciées
- Dans le package.json :
"browserslist": ["last 2 Chrome versions"]