VSCode之Vue文件代码格式化无效怎么办

标签: VsCode
14人阅读 评论(0) 收藏 举报
分类:

1.如果你是使用beautify插件格式化vue文件,那么打开:文件->首选项->设置

搜索  beautify.language ,在"html"里加上 "vue",如下图:
"beautify.language": {
"js": {
"type": [
"javascript",
"json"
],
"filename": [
".jshintrc",
".jsbeautify"
]
},
"css": [
"css",
"scss"
],
"html": [
"htm",
"html",
"vue"
]
}

然后使用快捷键 Shift+Alt+F,可以格式化整个vue文件,包括css、HTML(包括vue、elementUI等)、js。

2.组合键 Ctrl + K/Ctrl+F(先按Ctrl+K然后Ctrl键不动松开K键按F键) 对选中代码格式化,如果提示Ctrl+K,Ctrl+F不是命令,


那么打开:文件->首选项->设置,搜索 vetur.format.defaultFormatter.html,

none修改为“js-beautify-html”



查看评论

VS Code .vue文件代码缩进以及格式化代码

首先在应用商店中搜索“Vetur”插件安装,然后进行下面操作: 文件->首选项->设置,然后在右边编辑框输入以下设置: { "prettier.tabWidth": 4, ...
  • tangletao
  • tangletao
  • 2017-12-14 10:12:12
  • 8152

解决VS Code .vue文件代码无法格式化问题

首先在“扩展:商店”下载安装“Vetur ”插件;安装成功后进行如下设置(点击左下角设置进入用户设置,在用户设置中添加一下代码片段):{ "vue-html":"html...
  • IrisLoveOrange
  • IrisLoveOrange
  • 2018-02-09 11:40:28
  • 435

vscode格式化Vue出现的问题

一、VSCode中使用vetur插件格式化vue文件时,js代码会自动加上冒号和分号  本来就是简写比较方便舒服,结果一个格式化回到解放前 最后找到问题原因: 首先,vetur默...
  • qq_32340877
  • qq_32340877
  • 2018-03-07 17:13:55
  • 333

VS Code使用之Vue工程配置format代码格式化

编辑器另外一个很重要的功能就是代码格式化了,VS Code默认提供常见文件的格式化,如.js,.html等。添加对.vue文件的格式化支持这里我们添加对 .vue 文件的格式化支持。 1. 安装 V...
  • u013304372
  • u013304372
  • 2017-12-29 11:35:49
  • 1742

vscode格式化代码无效--可能的解决方法

因为vscode默认启用了根据文件类型自动设置tabsize的选项,因此,可以通过关闭自动设置选项,防止格式覆盖。在用户设置里添加如下配置即可: "editor.detectIndentation...
  • cauyahui
  • cauyahui
  • 2018-02-07 11:11:11
  • 1009

VS Code中 vue文件HTML代码格式化

问题:一般用Shift+Alt+F,可以格式化JS和CSS的部分,但template部分没反应。1. 在应用商店中搜索并安装 “Vetur” 插件2. 配置。文件 -> 首选项 -&am...
  • Loya0813
  • Loya0813
  • 2018-03-05 09:50:21
  • 93

VS code 中C/C++ 的代码格式化

对于微软新出的VS code编辑器,我个人评价还是很高的,虽然还存在不少BUG,但毕竟有VS stdio的底蕴,很多功能是别的编辑器无法比的(相比于Atom和Sublime),但是对于他的C/C++的...
  • wjw498279281
  • wjw498279281
  • 2016-09-27 20:24:18
  • 7786

Vetur:VSCode下强大的Vue开发工具

Vue自从发布以来就一直受到前端开发人员的热爱,而除了一些本身优秀的特征之外,还有就是丰富的插件和工具的支持和更新。虽然现在的编辑器需要安装相应的plugins才能进行Vue组件化开发,但是越来越多优...
  • xjlinme
  • xjlinme
  • 2017-06-27 09:27:31
  • 20533

vscode无法检查到vue文件里的语法错误

1.配置vscode的setting。 "eslint.autoFixOnSave": true, "eslint.validate": [ "javascript", { ...
  • qq_33797215
  • qq_33797215
  • 2017-12-29 10:14:17
  • 572

使用vscode,新建vue模板

第一步: 新建模板并保存文件 --> 首选项 --> 用户代码片段 --> 输入vue,选择vue.json -->复制 第三步中的模板内容...
  • win7583362
  • win7583362
  • 2017-07-26 10:28:40
  • 10725
    个人资料
    等级:
    访问量: 545
    积分: 108
    排名: 125万+
    文章存档