1npm i -D Prettier
1# Pretty a file
2npm prettier src/Filename.js --write
1# Prettier config file
2touch ~/.prettierrc
{}
{}
just means take everything default. VS Code will automatically start using prettier to format your files if it sees a .prettierrc
file. Make sure you have the following settings enabled in VS Code settings
1# VS Code config
2Editor: Format On Save
3Prettier: Require Config
1"scrpts": {
2 "format": "prettier --write 'src/**/*.{js,jsx,html,css,json}'"
3}
https://frontendmasters.com/courses/complete-react-v4/adding-prettier-cli-script/
Prettier handles formatting (spacing etc.), ESLint handles stylistic choices (variables not being used)
With ESLint you can use the Standard, Airbnb or ESLint recommended rules.
1npm i -D eslint eslint-config-prettier eslint-plugin-prettier
You can see what ESLint did with the --debug
flag
1"scrpts": {
2 "lint": "eslint '**/*.{js,jsx}'"
3}
1eslint 'src/**/*.{js,jsx}' --debug
2
3# the -- let's it know that we want to pass in ore params with the npm command
4npm run lint -- --debug
ESLint came after JSHint which came after JSLint
1// allow these globals and don't warn for them
2"globals": {
3 "React": true
4}