How to setup prettier (sublime text)

how-to-setup-prettier.md

Prettier setup

install prettier locally in project as well as globaly for support in your code editor

npm i -g prettier
npm i prettier --save-dev

add .prettierrc configuration file:

{
  "trailingComma": "es5",
  "tabWidth": 1,
  "semi": true,
  "singleQuote": true,
  "printWidth": 100,
  "jsxBracketSameLine": false
}

you can find all optinons on the following link:

https://prettier.io/docs/en/options.html

add .prettierignore file if you want to ignore some files

configure your editor to support prettier:

https://prettier.io/docs/en/editors.html

for support in sublime text install JsPrettier from Package installer

to format file right click anywhere in file and choose JsPrettier format code

you can also setup auto formatting of your project files through menu option Preference -> Package settings -> JsPrettier -> Settings - User

and there add following lines:

{
  "auto_format_on_save": true
}

to format files through npm script add format script in package.json file:

"format": "prettier --write \"src/**/*.ts\" -l \"warn\""

to format and fix ts errors through npm script add format:fix script in package.json file:

"lint:fix": "tslint -p . --fix",
"format:fix": "prettier --write \"src/**/*.ts\" -l \"warn\" && npm run lint:fix"