解决vscode里的vue文件代码变白色

最新推荐文章于 2025-02-04 13:50:42 发布
最新推荐文章于 2025-02-04 13:50:42 发布
阅读量2w 收藏 45
点赞数 39
分类专栏： vue 工作笔记 文章标签： vue.js vscode 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_39669919/article/details/125769596
版权
新入职同事在VSCode中遇到Vue文件无高亮显示的问题，尝试了安装Vetur和修改配置未见效。最终通过修改语言模式解决了问题：选择右下角的语言模式为'.vue'，然后将文件关联设置为HTML，成功实现Vue文件的高亮显示。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

新入职的同事 安完vscode 更完代码 发现vue文件白花花一片 没有高亮 太不得劲儿了
上网查找尝试了几个方法 有让下插件Vetur的 还有改配置的 均未生效

最后看到一位大哥的解决方案 --> 修改语言模式
（记录一下 以防忘掉）

1、右下角的选择语言模式（你的有可能不是Diff 我是为了复现一片白效果瞎选的）
在这里插入图片描述
2、选择自动检测下的 ".vue"的配置文件关联
（我的是汉化版本 英文应该是：Configure File Association for ‘.vue’…）
在这里插入图片描述
3、选 HTML
在这里插入图片描述
4、vue我也尝试选了 也有色儿
在这里插入图片描述

【Java错误解决方案】解决web前端中vscode工具js文件中js代码不高亮显示（.vue文件和.json文件中代码正常高亮显示）的问题
流川枫NO.1
09-16 308
在vscode编辑器JS文件中JS代码不高亮显示（.vue文件和.json文件中代码正常高亮显示）
vscode中自定义vue模板
Joyce的前端日常
01-03 1168
打开vscode后，在菜单栏File（文件） -> preperences（首选项） -> User Snippets(用户代码片段)弹框中输入vue选中vue.json { "vue-template": { "prefix": "vueTemp", "body": [ "<template>", " <div>",
重启了一下电脑后，vscode里的vue文件代码变白色
m0_74788415的博客
12-07 1340
试了很多方法，如果你也不成功或者报错，可以直接重新装volar(vue3的)，或者vetur(vue2的)，我的是显示版本不匹配，重新装了一下就好了。
Vue-解决编写vue项目时.vue文件全是白色字体，还没有提示！！！
m0_72149295的博客
10-17 2393
使用Vetur和Volar插件解决使用VS code 使用Vue进行项目开发时，.vue文件中代码全是白色，并且没有代码提示补全功能的问题
VSCode中代码颜色异常
最新发布
weixin_69266073的博客
02-04 327
VSCode代码颜色异常
vscode中js、vue部分代码为白色的解决方法
SodaCoca的博客
01-10 3821
去vscode的setting中查看，找到问题所在。解决问题的办法，就是更改vscode样式。
VS Code中VUE代码疯狂爆红，且没有颜色区分(全为白色)
阿土不土的博客
04-11 4618
VS Code中VUE代码疯狂爆红，且没有颜色区分(全为白色)----一招见效
vscode里vue工程的文件中代码都是白色的，也无法使用注释等快捷方式
记录和分享属于我的“IT”时光。
03-22 2698
vscode里vue工程的文件中代码都是白色的，也无法使用注释等快捷方式
【vscode写vue代码是白色怎么办】
qq_39858177的博客
12-09 856
在插件列表中搜索Vetur 安装即可。
vscode中.vue文件代码是白色解决方法
敲代码的小李同学的博客
07-13 1万+
.vue 文件代码是白色解决办法
VScode前端vue文件代码全是白色
06-13
这可能是因为您的VScode没有安装Vue插件或者Vue插件没有启用。...您可以通过在VScode中按下Ctrl + Shift + P，然后输入“Configure Language Specific Settings”来为.vue文件配置语言特定设置，确保语法高亮被启用。
vscode的vue代码全是白色
08-25
- *3* [解决vscode里的vue文件代码变白色](https://blog.csdn.net/qq_39669919/article/details/125769596)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_...
详解vscode中vue代码颜色插件
10-17
vscode的确是前端开发中很好的工具，安装颜色插件，从视觉上是美的享受。这篇文章主要介绍了vscode中vue代码颜色插件 ,需要的朋友可以参考下
vscode从听说到使用，vetur，prettier，htmljscssPrettify踩坑指南。
yinzhida's blog
02-28 1万+
今天基于vue-cli（2.9.3）构建一个新的项目。我用的sublime，es6的代码格式要与公司格式兼容。采用了vue-cli自带的eslint后，有一些不统一的部分需要修改。先看看sublime里需要怎么处理： 首先，在项目根目录下找到.eslintrc.js，在rules节点下新增两个配置项 // add your custom rules here rules: { /...
vscode中.vue文件代码是白色的？
热门推荐
qq_26337713的博客
12-17 1万+
点击vscode编辑器中的“方框样式图标”安装vetur插件，就可完美解决
vscode Vue代码script全白
qq_45600228的博客
10-08 536
vscode Vue代码script全白 不高亮显示
Vue代码突然都变成白色了
liuxiaochang_2011的博客
10-09 479
然后 vscode底部 Plain Text 点击。弹出框的下拉选中找到HTML 点击 页面恢复颜色高亮。
Visual Studio Code--代码全白色/不区分颜色的解决
wwwjjjyyy428的博客
07-27 1万+
VsCode左下角的设置，用户，最上方搜索栏 Code Actions On Save ->在settings.json中编辑。如果只修改文本为HTML格式代码还是没有颜色的话，试试以下操作~}, （记得在原来的}后补,）
【解决方法】vscode页面出现代码没有颜色，无提示字的情况
Ma_Zhen_的博客
06-29 8336
【解决方法】vscode页面出现代码没有颜色，无提示字的情况
评论 7
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值