尧图网站建设 尧图网络
  • 首页
  • 关于我们
  • 服务项目
  • 案例展示
  • 建站流程
  • 资讯中心
  • 联系我们
首页/资讯中心/详情

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

使用cursor 编辑器开发 Vue项目,调整ESlint自动修复脚本,消除代码不规范引起的报错无法运行项目问题
📅 发布时间:2026/6/19 8:10:44

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

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

相关新闻

  • 详细介绍:为何选择Spring框架学习设计模式与编码技巧?
  • 2025 年试验机厂家最新推荐榜单:专精特新企业深度解析,含疲劳 / 压力 / 液压万能等设备优质厂家水泥压力/压剪/锚链拉伸整形机/链条拉伸整形机厂家推荐
  • rtthread学习笔记系列 -- 13 线程

最新新闻

  • DeepSeek-V4长任务能力深度解析:跨页指代、分层KV Cache与DSPE编码
  • 深孔钻头选购,如何选择永昌工具这样的好品牌 - 工业品网
  • 2026年免费快速:PPT转PDF并压缩全攻略(小程序+公众号) - 时时资讯
  • LLM与RNN混合架构在代码理解中的应用与优化
  • 河北福亚斯保温建材口碑怎么样?深度评测与推荐 - mypinpai
  • 2026年好用的PTFE管道品牌,推荐哪家? - mypinpai

日新闻

  • 5分钟掌握Python进化算法:Geatpy高性能优化工具完全指南
  • Microchip 24AA044 EEPROM选型与应用全指南:从参数解析到实战编程
  • 华为的鸿蒙到底有多牛?为什么称作遥遥领先?

周新闻

  • 3步解锁iOS设备:applera1n激活锁绕过完全指南
  • 39 2026 人工智能证书终极盘点,普通人选 AI 证书可以从这些方向入手
  • Redis 暴露公网有多危险?从端口检查到补救步骤

月新闻

  • 【总结】入门篇:50句话让你记住架构核心概念
  • WeChatMsg技术方案解析:实现Mac微信数据自主管理的完整解决方案
  • WeChatMsg:革新性微信数据备份方案,打造你的专属数字记忆库

关于尧图

  • 公司简介
  • 团队介绍
  • 企业文化
  • 荣誉资质

服务项目

  • 定制开发
  • 电商建站
  • UI 设计
  • 运维服务

快速链接

  • 案例展示
  • 建站流程
  • 常见问题
  • 资讯中心

联系方式

  • 📍北京市朝阳区互联网产业园 A 座 10 层
  • 📞400-888-8888
  • ✉️contact@rkmt.cn
  • 🕐周一至周日 9:00-21:00

© 2024 北京尧图网络科技有限公司 版权所有 | 京 ICP 备 XXXXXXXX 号