For initial install on a React front-end and to set up automatic code formatting execute the following. Skip this if someone else has set it up already.
Step 1
Add prettier to your project:
npm install prettier --save-dev --save-exact
Step 2
Verify by running against a file:
npx prettier --write src/index.js
Step 3
Run prettier when commiting files:
npm install pretty-quick husky --save-dev
Then add this config to package.json:
{ "husky": { "hooks": { "pre-commit": "pretty-quick --staged" } } }
guylepage3
commented
5 years ago
Description Research and install Prettier.io for better styling of code without having to discuss what style is better and saves a lot of time.
Create React App folks recommend using Prettier. Setting Up Your Editor
Initial install on a front-end
For initial install on a React front-end and to set up automatic code formatting execute the following. Skip this if someone else has set it up already.
Step 1
Add prettier to your project:
npm install prettier --save-dev --save-exactStep 2
Verify by running against a file:
npx prettier --write src/index.jsStep 3
Run prettier when commiting files:
npm install pretty-quick husky --save-devThen add this config to package.json:{ "husky": { "hooks": { "pre-commit": "pretty-quick --staged" } } }Setting up Prettier on Sublime Text 3
JSPrettier.Setting up Prettier on VSCode
Not sure how to do this on VSCode but I would imagine it's quite simple. Here's a video tutorial I found for those using VSCode. VSCode ESLint, Prettier & Airbnb Style Guide Setup