Creating vite vue ts template: Setup pre-commit

Create pre-commit configuration

1. pre-commit sample-config > .pre-commit-config.yaml

2. Add prettier hook to .pre-commit-config.yaml
   

   +-   repo: https://github.com/pre-commit/mirrors-prettier
   +    rev: ''  # Use the sha / tag you want to point at
   +    hooks:
   +    -   id: prettier
   

3. Add eslint hook to .pre-commit-config.yaml
   

   +-   repo: https://github.com/pre-commit/mirrors-eslint
   +    rev: ''  # Use the sha / tag you want to point at
   +    hooks:
   +    -   id: eslint
   +        additional_dependencies:
   +        -   eslint@7.31.0
   +        -   typescript@4.3.5
   +        -   "@typescript-eslint/eslint-plugin@4.28.5"
   +        -   "@typescript-eslint/parser@4.28.5"
   +        -   eslint-plugin-vue@7.14.0
   +        -   vue-eslint-parser@7.9.0
   +        -   eslint-config-prettier@8.3.0
   

4. Update eslint hook to run for *.js, *.jsx, *.ts, *.tsx and *.vue

   By default only *.js files are taken into consideration. If you want to use eslint on TypeScript codebases you need to start from this template
   

        hooks:
        -   id: eslint
   +        files: \.([jt]sx?|vue)$  # *.js, *.jsx, *.ts, *.tsx and *.vue
   +        types: [file]
   

5. git add .pre-commit-config.yaml

6. pre-commit autoupdate

7. pre-commit run --all-files

8. git add -u

9. git commit -m 'setup pre-commit'

Links

• https://pre-commit.com
• https://github.com/pre-commit/mirrors-prettier
• https://github.com/pre-commit/mirrors-eslint

Project

imomaliev / vue-ts

Vite + Vue + TypeScript template