Vue项目报错: Expected space or tab after ‘//‘ in comment.(spaced-comment)

本文介绍了两种方法解决ESLint报错关于在'//'后需添加空格的问题。实践证明,在'//'后添加空格或Tab键可以消除错误。另外,检查设置发现虽未安装ESLint,但配置文件中仍有相关引用,考虑移除配置或禁用该规则。

解决办法,找对对应代码行:

根据提示可以知道通过在“//”符号后面打空格或者是按Tab键,即可解决此问题,通过实践,可以解决这个问题。

添加之后,后面的报错也没了,很神奇:

方案二:

a.点击导航栏中的“file”,进入“settings”;

ESLint 是一个语法规则和代码风格的检查工具,可以用来保证写出语法正确、风格统一的代码。

将它关了,选Disable的,但是在扩展里我发现我没有安装ESlint。

但是在配置里有:

 

 

 "eslint": "6.7.2",
    "eslint-plugin-vue": "6.2.2",

如有需要可以去掉eslint;在下面这个文件里面全局搜索删除。

 

<think>好的,我需要解决用户提到的Vue CLI项目中的两个问题:spaced-comment ESLint错误和webpack跨域问题。首先,我得分别分析这两个问题的原因,然后找到对应的解决方法。 关于spaced-comment错误,ESLint的规则通常要求在注释的//或/*后有一个空格。比如用户可能在代码中写了类似//注释而没有空格,这就会触发错误。解决方法应该是修改注释格式,添加空格,或者调整ESLint配置来关闭或修改这个规则。用户可能需要检查他们的.eslintrc.js文件,找到对应的规则设置。比如,如果规则是"spaced-comment": ["error", "always"],那可能需要改成允许某些例外,或者完全关闭它。但建议保持规则开启,只是调整代码中的注释格式。 然后是webpack跨域问题。用户可能在开发环境中请求后端API时遇到了跨域问题。通常的解决方案是在webpack配置中设置代理。Vue CLI项目使用vue.config.js来覆盖默认的webpack配置。用户需要在该文件中添加devServer的proxy配置,将特定的API请求转发到后端服务器。比如,设置代理到http://localhost:8080/api,这样前端发起的请求会被代理到后端,避免浏览器的跨域限制。另外,用户提到的引用[3]中提到了echarts安装时的跨域问题,可能需要检查是否正确设置了代理,或者是否需要在后端配置CORS头。 接下来,我需要验证这些解决方案是否正确。对于spaced-comment,确保注释格式正确,或者调整规则。对于跨域,检查代理配置是否正确,是否匹配了需要转发的请求路径。同时,可能需要重启开发服务器让配置生效。另外,用户提到修改webpack配置后需要重新执行npm run build,但如果是开发服务器的话,可能需要重启npm run serve。不过,vue.config.js的修改可能需要重启服务才能生效。 最后,生成相关问题时要考虑用户可能的后续疑问,比如如何配置其他ESLint规则,或者代理不生效时的调试方法,以及生产环境的跨域处理等。</think>### 解决Vue CLI项目中的ESLint spaced-comment错误和webpack跨域问题 #### 一、修复spaced-comment ESLint错误 **问题原因** ESLint的$spaced-comment$规则要求注释符号(如$//$或$/*$)后必须有一个空格。例如,若代码中存在`//注释`(无空格)会触发报错。 **解决方法** 1. **修改注释格式** 在注释符号后手动添加空格: ```javascript // 正确注释(带空格) /* 正确块注释 */ ``` 2. **调整ESLint规则配置** 在项目根目录的$.eslintrc.js$文件中,修改规则配置: ```javascript module.exports = { rules: { // 允许特定注释格式(如JSDoc的"///") "spaced-comment": ["error", "always", { "exceptions": ["/"] }] } } ``` 或完全关闭规则(不推荐): ```javascript "spaced-comment": "off" ``` #### 二、解决webpack跨域问题 **问题原因** 浏览器同源策略会阻止前端直接请求不同域名/端口的API,导致跨域错误。 **解决方法** 通过配置webpack代理将API请求转发到后端服务器: 1. **创建/修改vue.config.js** 在项目根目录新建或修改$vue.config.js$文件: ```javascript module.exports = { devServer: { proxy: { '/api': { // 代理标识(匹配所有以/api开头的请求) target: 'http://your-backend-domain.com:8080', // 后端地址 changeOrigin: true, // 允许跨域 pathRewrite: { '^/api': '' // 移除请求路径中的/api前缀 } } } } } ``` 2. **重启开发服务** 执行命令使配置生效: ```bash npm run serve -- --force ``` #### 三、验证配置 1. **注释验证** 检查代码中所有注释是否符合$spaced-comment$规则,例如: ```javascript // 正确示例(带空格) this.$echarts.init() // 引用[3]中的ECharts初始化 ``` 2. **跨域验证** 前端请求应改为: ```javascript axios.get('/api/data') // 实际会被代理到http://your-backend-domain.com:8080/data ```
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

编程图一乐

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值