vscode scss样式飘红以及eslint无法自动检测
最近在使用vscode时,遇到了两个问题。scss样式飘红类似于这样,虽然并不影响代码,但是非常不美观。解决方法如下:安装插件vetur 插件配置文件的处理点击 vetur右侧的齿轮图标,选择“扩展设置”,然后自动打开设置页面。点击“在settings.json”中编辑,然后会自动打开setting.json文件,或者点击右上角的这个图标也可以进行视图与代码区域的切换。在settings.json
·
最近在使用vscode时,遇到了两个问题。
scss样式飘红
类似于这样,虽然并不影响代码,但是非常不美观。
解决方法如下:
- 安装插件 vetur 插件
- 配置文件的处理
点击 vetur右侧的齿轮图标,选择“扩展设置”,然后自动打开设置页面。
点击“在settings.json”中编辑,然后会自动打开setting.json文件,或者点击右上角的这个图标也可以进行视图与代码区域的切换。
在settings.json中写入"files.associations": { “.vue": “vue” }。
我本来的setting.json文件中是有这个选项的。“files.associations”:{".vue”:“html”},此处我直接把后面的"html"改为"vue",就去掉了scss样式飘红的问题。
效果如下;
vscode eslint代码无法自动检测,导致代码提交时报错
eslint插件我早就安装好了,但是依然没有对我的代码进行自动检测,比如===
我写成了==
,字符串应该用双引号进行包裹,我写成了单引号。这种的错误应该是eslint检测出来的。
查找资料后发现,仅仅是安装了eslint插件并启用,是不够的,还需要对setting.json文件进行处理。
处理如下:
参考链接:vscode安装eslint插件
此文章中,我没有进行最后一步操作,能够达到预期的效果。
这一步是很关键的,最后一步,我操作后发现没有效果,去掉最后一步后,反而有效。
最终效果:
该写===
的地方,我写了==
,此时就会有飘红报错,改正后,则报错消失。
与vscode编辑器对应的webstorm软件,在文件中右击就会有代码格式自动检测并修复的选项,但是vscode是没有的。
更多推荐
已为社区贡献69条内容
所有评论(0)