安装eslint

pnpm add -D eslint@latest

初始化eslint

pnpx eslint --init

You can also run this command directly using 'npm init @eslint/config'.
 
? How would you like to use ESLint? ...
To check syntax and find problems
 
? What type of modules does your project use? ...
JavaScript modules (import/export)
 
? Which framework does your project use? ...
Vue.js
 
? Does your project use TypeScript? » No / Yes
Yes
 
? Where does your code run? ... (用空格选中两个，回车确定)
√ Browser
√ Node
 
? What format do you want your config file to be in? ...
JavaScript
 
The config that you've selected requires the following dependencies:
eslint-plugin-vue@latest @typescript-eslint/eslint-plugin@latest @typescript-eslint/parser@latest
? Would you like to install them now?
No

手动安装依赖

pnpm add -D eslint-plugin-vue@latest @typescript-eslint/eslint-plugin@latest @typescript-eslint/parser@latest

修改eslint配置文件

{
    ...
    // 配置解析vue文件
    "parser":"vue-eslint-parser",
    "parserOptions": {
   ...
}

安装 vite-plugin-eslint

pnpm add -D vite-plugin-eslint

修改vite.config.ts

import eslintPlugin from "vite-plugin-eslint"
// ...
plugins: [
      eslintPlugin({
        include: [
          '{src}/**/*.{j,t}s?(x)',
          '{src}/**/*.vue'
        ]
      })
]