vs code中Vue代码格式化

最新推荐文章于 2024-03-06 10:38:00 发布
最新推荐文章于 2024-03-06 10:38:00 发布
阅读量926 收藏 1
点赞数 2
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/XIAO_YuBaby/article/details/103013842
版权

VSCode自从更新之后，vue文件的html代码格式化就失效了，原因在于都采用了 prettier 来格式化，而配置文件中 vetur.format.defaultFormatter.html 这个配置项的值为"none"，我们需要对它重新进行设置。

一.安装插件

扩展里边直接搜索Vetur插件，点击安装就可以
在这里插入图片描述

二.更改设置

文件->首选项->设置，搜索vetur，按如下图示将vetur插件的 vetur.format.defaultFormatter.html 的值修改成 js-beautify-html，然后保存即可
在这里插入图片描述
之后按住 alt+shift+f 就可以格式化代码啦

XIAO_YuBaby
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
vs code中 prettier 对js不起作用设置
12-31
vs code中 prettier 对 .vue 文件格式化有效果，但是对 .js 文件不起作用，此方法能有效地解决此问题。
Vscode使用格式化文档无效（vue代码格式化文档无效）
weixin_65793170的博客
04-11 7536
最近在写代码的时候，vscode使用格式化文档不管用，原因竟是单页面使用大量element组件和html代码导致，vscode识别不了。
vscode中如何对vue文件代码进行格式化
最新发布
自强不息，厚德载物，未来可期
03-06 801
vscode中如何对vue文件代码进行格式化 1.通过vscode的Extensions插件市场，搜索Vetur插件。Vetur是一个专门为Vue开发提供支持的插件，它提供了代码高亮、智能提示、语法检查等功能 2.找到vscode的设置Settings，然后在搜索栏中输入：“Editor:Default Formatter”，选择"Vetur"作为默认的代码格式化工具 3.使用快捷键格式化...
VS Code插件Prettier - Code formatter格式化无效解决
qq_38188228的博客
06-28 1万+
在Vue代码格式插件文章配置好json文件后，保存后代码还是为进行自动格式化。可以在此的基础上添加代码。 1、进入设置面板 2、点击按钮打开json文件 3、复制以下代码追加粘贴 "typescript.preferences.quoteStyle": "single", "editor.tabSize": 2, "[typescript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" },
【VScode】工具中【Vue】代码格式化及配置
qq_37219845的博客
04-18 9807
VScode工具中Vue代码格式化及配置 效果 换行空格：2个；组件标签内属性自动换行 插件 安装Vetur插件 配置 打开setting.json文件 1.方法一：快捷键：ctrl+shift+p 2.方法二：通过VScode中【文件】→【首选项】→【设置】：找到“在setting.json中编辑” 主要配置vetur中的相关属性 ...
vue 代码格式化（VS code）
qq_38210427的博客
04-03 2325
1、安装了vetur（Vue tooling for VS Code）扩展插件。在扩展中搜索vetur，然后点击安装。2、直接（或者 选中你想格式化的代码），右键，选择“格式化文档“，另外是直接快捷键”Shift+Alt+F”，即可。
VSCode 设置vue 保存自动格式化代码
weixin_30723433的博客
08-22 3928
设置保存自动格式化代码，开发效率大大提升！ 操作如下： 安装VSCodeeslint插件 如下配置setting.json文件： { // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tabsize "editor.tabSi...
ESLint 工具
编程菜鸟
03-18 2608
ESLint 可组装的 javaScript 和 JSX 检查工具。规范代码风格 官网：ESLint - 插件化的 JavaScript 代码检测工具 - ESLint中文文档 VSCode 自动格式化代码 ESLint安装 ① 项目创建时 配置 ESLint ② 配置 .eslintrc.js 配置文件 "off"或者0 //关闭规则关闭 "warn"或者1 //在打开的规则作为警告（不影响退出代码） "error"或者2 //把规则作...
vue实现codemirror代码编辑器中的SQL代码格式化功能
10-16
主要介绍了vue实现codemirror代码编辑器中的SQL代码格式化功能,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下
详解VS Code使用之Vue工程配置format代码格式化
10-17
主要介绍了详解VS Code使用之Vue工程配置format代码格式化，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
codeMirror代码格式化（官方demo）
06-14
codeMirror代码格式化工具,支持sql、C、Java等目前主流的编程语言
VS Code使用之Vue工程配置format代码格式化
Joe的博客
06-19 2649
编辑器另外一个很重要的功能就是代码格式化了，VS Code默认提供常见文件的格式化，如.js,.html等。 添加对.vue文件的格式化支持 这里我们添加对 .vue 文件的格式化支持。 1. 安装 Vetur 插件 2. 在 VS Code 的设置中添加如下规则： { "vetur.format.defaultFormatter": { "html": "pr...
VS Code 设置解析及保存代码格式化问题
热门推荐
lwx931449660的博客
09-09 1万+
问题的由来是这样的，git 上拉去的代码，用vscode打开，随便打开一个vue文件，习惯性的 Ctrl + S 保存了，然后 git 显示文件有更改，查看工作树，显示是这样的 这个问题困扰了好久，网上各种查找，各种修改配置，都不起作用，不过最终还是解决了，先上解决办法， ............
VS Code保存后自动格式化Vue代码---Vetur
qq_38210427的博客
03-17 4620
vscode
Vs Code 自动格式化 Vue 代码
一碗周
04-19 1815
{ //每行最多多少个字符换行 "printWidth": 100, // tab缩进大小,默认为2 "tabWidth": 4, // 使用tab缩进，默认false "useTabs": false, // 使用分号, 默认true "semi": false, // 使用单引号, 默认false(在jsx中配置无效, 默认都是双引号) "singleQuote": false, // 行尾逗号,默认none,可选 none|
vs code vue 格式化配置
01-11 780
首选项-设置 搜索vetur 找到setting.json "[vue]": { "editor.defaultFormatter": "octref.vetur" // 使用 vetur 格式化规则 }, "vetur.format.defaultFormatterOptions": { "prettier": { "semi": false, // 去掉分号 "singleQuote": true, // true 为使用单引号 .
vscode vue格式化配置
上海小宋的博客
08-30 1万+
ESlint：是用来统一JavaScript代码风格的工具，不包含css、html等。 1.安装插件： 1）ESlint： javascript代码检测工具，可以配置每次保存时格式化js，但每次保存只格式化一点点，你得连续按住Ctrl+S好几次,才格式化好，自行体会~~ 2）vetur： 可以格式化html、标准css（有分号 、大括号的那种）、标准js（有分号 、双引号的那种）、vue文件， 但...
vscode无法格式化vue
事在人为2018的博客
05-10 5077
升级vscode后发现无法通过Alt+shift+F快捷键通过prettier格式化vue中的js了。貌似识别不了vue中的js内容。终于长到了方法，需要设置vetur的format.defaultFormatterOptions，如下 { “vetur.format.defaultFormatterOptions”: { “prettier”: { “singleQuote”: true, “s...
vue中codemirror怎么格式化代码
05-30
下面以使用官方的 Vue 组件为例来说明如何在 Vue 中使用 CodeMirror 并格式化代码。 首先，在 Vue 项目中安装 CodeMirror 和 CodeMirror 的 Vue 组件： ``` npm install codemirror vue-codemirror --save ``` ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值