在Vue 3项目中配置ESLint以保证代码风格一致性并在保存时自动格式化，你需要按照以下步骤操作：
- 安装必要的包：
npm install eslint eslint-plugin-vue --save-dev- 初始化ESLint配置文件（
.eslintrc.js）：
module.exports = {
extends: [
// 添加 Vue 规则
'plugin:vue/vue3-recommended',
// 其他规则...
],
rules: {
// 自定义规则...
}
};- 安装并配置Prettier：
npm install prettier eslint-config-prettier eslint-plugin-prettier --save-dev在.eslintrc.js中添加插件和规则：
module.exports = {
// ...
extends: [
// 添加 Prettier 规则
'plugin:prettier/recommended'
],
// 关闭 ESLint 规则，由 Prettier 处理
rules: {
'prettier/prettier': 'off',
// 其他规则...
}
};- 安装并配置
eslint-plugin-prettier：
npm install eslint-plugin-prettier --save-dev- 在
package.json中添加一个脚本来运行ESLint：
{
"scripts": {
"lint": "eslint --ext .js,.vue src"
}
}- 保存时自动格式化，你可以使用编辑器插件，如VSCode中的
ESLint和Vetur插件，或者通过安装npm脚本：
npm install --save-dev npm-run-all然后在package.json中添加：
{
"scripts": {
"format": "prettier --write \"src/**/*.{js,vue}\"",
"watch": "npm run format && onchange 'src/**/*.{js,vue}' -- npm run format"
}
}运行npm run watch将启动一个监听程序，它会在你保存文件时自动格式化你的代码。
确保你的编辑器或IDE 配置了保存时运行linting工具，这样在保存文件时就会自动格式化代码。