使用cursor 编辑器开发 Vue项目，配置ESlint自动修复脚本，解决代码不规范引起的报错无法运行项目问题_cursor vue

一、 使用cursor 编辑器开发，配置ESlint 自动修复脚本

ESlint：是用来统一JavaScript代码风格的工具，不包含css、html等

在开发中，遇到ESlint报警

解决方法

.在 .eslintrc.js 中添加了明确的规则配置：

1. space-before-function-paren: 强制函数括号前有空格
2. comma-dangle: 禁止尾随逗号
3. semi: 禁止使用分号
4. quotes: 强制使用单引号
5. 在 package.json 中修改了 lint 脚本，添加了 --fix 选项，这样每次运行 npm run lint 时都会自动修复问题。

1.在 .eslintrc.js 文件中，编写如下代码

完整代码：

module.exports = { root: true, env: { node: true }, extends: [\'plugin:vue/essential\', \'@vue/standard\'], parserOptions: { parser: \'@babel/eslint-parser\' }, rules: { \'no-console\': process.env.NODE_ENV === \'production\' ? \'warn\' : \'off\', \'no-debugger\': process.env.NODE_ENV === \'production\' ? \'warn\' : \'off\', \'space-before-function-paren\': [\'error\', \'always\'], \'comma-dangle\': [\'error\', \'never\'], semi: [\'error\', \'never\'], quotes: [\'error\', \'single\'] }}

2.在 package.json 中添加一个自动修复的脚本

代码：

 \"scripts\": { \"serve\": \"vue-cli-service serve\", \"build\": \"vue-cli-service build\", \"lint\": \"vue-cli-service lint --fix\" },

之后，每次保存文件时都会自动修复 ESLint 错误，不需要手动运行命令行了

最后 重启服务就可以生效了~