Configuring Prettier pre-commit hook
1. Install Pritter
npm install --save-dev --save-exact prettier
2. Create Prettier Configuration File
Create a .prettierrc file and paste your configuration into it. For more options, refer to the Prettier documentation.
{
"arrowParens": "avoid",
"singleQuote": true,
"semi": true,
"bracketSameLine": false,
"bracketSpacing": true,
"vueIndentScriptAndStyle": true,
"trailingComma": "es5",
"singleAttributePerLine": true,
"jsxBracketSameLine": true,
"tabWidth": 2,
"useTabs": false,
"printWidth": 100
}
3. Set Up Pre-commit Hook
npm install --save-dev husky lint-staged
npx husky install
npm pkg set scripts.prepare="husky install"
npx husky add .husky/pre-commit "lint-staged"
4. Update package.json with Lint-Staged Configuration
"lint-staged": {
"*.js": "eslint --fix",
"{**/*,*}.{js,vue,html,css}": "prettier --write"
}