Feat/6 add git hooks

.eslintrc.cjs

@@ -3,22 +3,32 @@ require('@rushstack/eslint-patch/modern-module-resolution');
 
 module.exports = {
   root: true,
-  extends: ['plugin:vue/vue3-essential', 'eslint:recommended', '@vue/eslint-config-typescript/recommended', '@vue/eslint-config-prettier', 'plugin:storybook/recommended', 'plugin:storybook/recommended'],
+  extends: [
+    'plugin:vue/vue3-essential',
+    'eslint:recommended',
+    '@vue/eslint-config-typescript/recommended',
+    '@vue/eslint-config-prettier',
+    'plugin:storybook/recommended',
+    'plugin:storybook/recommended',
+  ],
   parserOptions: {
-    ecmaVersion: 'latest'
+    ecmaVersion: 'latest',
   },
   rules: {
-    'prettier/prettier': ['error', {
-      singleQuote: true,
-      trailingComma: 'es5',
-      printWidth: 80,
-      tabWidth: 2,
-      semi: true,
-      bracketSpacing: true,
-      arrowParens: 'always',
-      jsxBracketSameLine: false,
-      vueIndentScriptAndStyle: false
-    }],
-    'vue/multi-word-component-names': 0
-  }
-};
+    'prettier/prettier': [
+      'error',
+      {
+        singleQuote: true,
+        trailingComma: 'es5',
+        printWidth: 80,
+        tabWidth: 2,
+        semi: true,
+        bracketSpacing: true,
+        arrowParens: 'always',
+        jsxBracketSameLine: false,
+        vueIndentScriptAndStyle: false,
+      },
+    ],
+    'vue/multi-word-component-names': 0,
+  },
+};

.gitignore

@@ -26,3 +26,6 @@ coverage
 *.njsproj
 *.sln
 *.sw?
+
+yarn.lock
+package-lock.json

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npx lint-staged

package.json

@@ -22,7 +22,8 @@
     "type-check": "vue-tsc --noEmit -p tsconfig.vitest.json --composite false",
     "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
     "storybook": "start-storybook -p 6006",
-    "build-storybook": "build-storybook"
+    "build-storybook": "build-storybook",
+    "prepare": "husky install"
   },
   "dependencies": {
     "vue": "^3.2.37"
@@ -49,8 +50,11 @@
     "eslint": "^8.21.0",
     "eslint-plugin-storybook": "^0.6.4",
     "eslint-plugin-vue": "^9.3.0",
+    "husky": "^8.0.0",
     "jsdom": "^20.0.0",
+    "lint-staged": "^13.0.3",
     "npm-run-all": "^4.1.5",
+    "pinst": "^3.0.0",
     "postcss": "^8.4.16",
     "prettier": "^2.7.1",
     "tailwindcss": "^3.1.8",
@@ -59,5 +63,8 @@
     "vitest": "^0.21.0",
     "vue-loader": "^16.8.3",
     "vue-tsc": "^0.39.5"
+  },
+  "lint-staged": {
+    "*.vue": "eslint --fix"
   }
 }

postcss.config.cjs

@@ -1,6 +1,7 @@
+/* eslint-env node */
 module.exports = {
   plugins: {
     tailwindcss: {},
     autoprefixer: {},
   },
-}
+};

src/components/Button/Button.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import './button.css';
-import { reactive, computed } from 'vue';
+import { computed } from 'vue';
 export interface Props {
   label?: string;
   type: string;