vue3项目，vite+vue3+ts+pinia(2)-规范eslint

项目新建好了，一个中大型的项目是多人开发，代码规范需要约束一下

1. 项目终端： npm install eslint --save-dev
2. npx eslint --init
   
   

3. eslint 安装完成
4. 验正 eslint , 在package.json 文件中

{
	...,
	scripts：{
	  ...,
	  "lint": "eslint ./src/**/*.{js,jsx,vue,ts,tsx} --fix"
	},
	...
}

5. 在项目终端： npm run lint
   
6. 报错了，不急，需要配置项目文件，vscode插件商店；禁用：vetur 插件，安装eslint 插件和volar 插件，这个eslint 格式

还有设置中 --> 扩展 --> eslint --> 选择中

7. 在.eslintrc.cjs 文件中

...,
  extends: [
    'plugin:vue/vue3-strongly-recommended',
    'standard'
  ],
...,
  parserOptions: {
    ecmaVersion: 'latest',
    parser: '@typescript-eslint/parser',
    sourceType: 'module'
  },
...,

8. 注意选择格式（Eslint），(ts文件中)鼠标右键–>使用…格式化文档–> eslint
9. 在终端： npm run lint， 就ok了
10. ，终端： npx mrm@2 lint-staged ， git t提交代码验正（git commit -m ‘init eslint’）
    你会发现在package.json 文件中底部

"lint-staged": {
    "*.js": "eslint --cache --fix"
  }

 改成，下面的，

"lint-staged": {
    "*.{js,jsx,vue,ts,tsx}": [
      "npm run lint",
      "git add"
    ]
  }

11. vite 插件也有eslint
12. 终端： npm install vite-plugin-eslint --save-dev
13. 在vite.config.ts 文件中

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import eslintPlugin from 'vite-plugin-eslint'
export default defineConfig({
  plugins: [
    vue(),
    eslintPlugin({
      cache: false // eslint 缓存
    })
  ]
})

14. npm run dev , ok了， 如果代码报错可以看到哪个页面报错在多少行