当前位置: 首页 > news >正文

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

一、 使用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 错误,不需要手动运行命令行了

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

相关文章:

  • 使用TypeScript构建一个最简单的MCP服务器
  • 开源库 API 化平台 (ALLBEAPI) - 让优秀工具触手可及!
  • PowerBI企业运营分析—全动态盈亏平衡分析
  • VS Code开发项目,配置ESlint自动修复脚本
  • Ubuntu 25.10 将默认使用 sudo-rs
  • 在CSDN发布AWS Proton解决方案:实现云原生应用的标准化部署
  • Solana Web3 快速入门:创建并获取钱包账户的完整指南
  • iOS UIActivityViewController 组头处理
  • 第 86 场周赛:矩阵中的幻方、钥匙和房间、将数组拆分成斐波那契序列、猜猜这个单词
  • NLP学习路线图(二十四):门控循环单元(GRU)
  • 经典ReLU回归!重大缺陷「死亡ReLU问题」已被解决
  • 分类与逻辑回归 - 一个完整的guide
  • 学习笔记085——Spring Data JPA笔记
  • RabbitMQ 的异步化、解耦和流量削峰三大核心机制
  • Elasticsearch中的映射(Mapping)是什么?
  • Git Github Gitee GitLab
  • 区块链跨链通信:使用 Cosmos SDK 实现链间互操作
  • 电子手机商城源码+springboot+vue3(带用户协同过滤个性化推荐算法)
  • gitlab rss订阅失败
  • 文献分析指令
  • 网站建设排行榜/媒体推广
  • 建设网站都需要准备什么/新手做网络销售难吗
  • 小学生网站制作/seo教程网
  • 地方门户网站源码/app推广策划方案
  • 企业手机网站建设价位/百度关键词优化大师
  • 今日国内最新头条新闻/百度seo服务公司