VsCode 中 vue代码格式化 (整理代码)

最新推荐文章于 2024-03-31 17:42:32 发布
最新推荐文章于 2024-03-31 17:42:32 发布
阅读量1.4w 收藏 11
点赞数 5
分类专栏： 编辑器 文章标签： vue 代码格式化
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_40690947/article/details/87803597
版权

VsCode 中 vue代码格式化....整理代码

前提 : VS_Code中安装好插件 : Vetur

第一步: 打开vscode --> 文件 --> 首选项 --> 设置

Alt

第二步: 选择扩展项 --> 打开settings.json文件

在这里插入图片描述

第二步: 在settings.json文件 --> 找到"eslint.validate" --> 添加"vue"

在这里插入图片描述

编辑器中 试试 “Shift + Alt + F”

链接: 参考 vscode插件: Vetur 文档提示.

盒子说不说
关注
  • 5
    点赞
  • 踩
  • 11
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
VSCode 设置vue 保存自动格式化代码
weixin_30723433的博客
08-22 4090
设置保存自动格式化代码，开发效率大大提升！ 操作如下： 安装VSCodeeslint插件 如下配置setting.json文件： { // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tabsize "editor.tabSi...
Visual Studio Code mac 电脑格式化 显示vue 代码
m0_37678007的博客
12-14 433
【代码】Visual Studio Code mac 电脑格式化 显示vue 代码。
解决vsCode格式化vue代码的问题，前端面试基础技能罗列
erthre的博客
03-31 508
由于文档内容过多，为了避免影响到大家的阅读体验，在此只以截图展示部分内容CodeChina开源项目：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】，在此只以截图展示部分内容CodeChina开源项目：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
vue vscode settings代码格式化配置
weixin_46919365的博客
12-14 760
/ "prettier.ignorePath": ".prettierignore", // 不使用prettier格式化的文件填写在项目的.prettierignore文件中。// "prettier.disableLanguages": ["vue"], // 不格式化vue文件，vue文件的格式化单独设置。// "prettier.parser": "babylon", // 格式化的解析器，默认是babylon。// "prettier.printWidth": 100, // 超过最大值换行。
vscode代码格式化设置
weixin_55985591的博客
02-07 2381
vscode代码格式化设置
vscode中vue代码格式相关设置,(个人观点)
github_66624340的博客
05-26 2844
设置完在文件夹中新建xxx.vue,打开后在第一行写vue就可以快速生成 效果如下: 设置: 点击左下角的设置,选择设置在设置中搜索tab size,设置成2,这样tab就改为默认的2个空格 生成代码格式设置: 点击用户代码片段 选择下面的vue.json(vue) 把下面的代码复制到其中 { "Print to console": { "prefix": "vue" , "body": [ "<template>" ...
详解vscode中vue代码颜色插件
10-17
vscode的确是前端开发中很好的工具，安装颜色插件，从视觉上是美的享受。这篇文章主要介绍了vscode中vue代码颜色插件 ,需要的朋友可以参考下
vscode下的vue文件格式化问题
10-17
Vetur是一款针对Vue生态的VSCode插件，提供代码高亮、智能提示、格式化等功能。然而，在Vetur更新到0.14.2版本后，可能会出现格式化问题，这主要是由于Vetur的默认配置和推荐的格式化工具发生了变化。 首先，Vetur...
Vue-cli Eslint在vscode里代码自动格式化的方法
08-27
本篇文章主要介绍了Vue-cli Eslint在vscode里代码自动格式化的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
vscode代码格式化和eslint的使用
10-15
主要介绍了vscode代码格式化和eslint的使用，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020最新版vscode格式化代码的详细教程
10-14
本文将详细介绍如何在VSCode中设置和使用代码格式化，以及相关的注意事项。 首先，了解代码格式化的目的至关重要。其一，代码格式化提高了代码的可读性，有助于个人编码效率和团队协作。统一的代码风格可以使团队...
vscode Vue项目 ESlint 风格格式化配置
Qanx的博客
03-03 1672
vscode Vue项目 ESlint 风格格式化配置
vue项目eslint格式化最全注释！拿走不谢
c1518589418的博客
12-11 5182
JavaScript语言因为其灵活，怎么写都不会错的特点深受开发人员喜爱，然而过于灵活也会导致一些难以排查的bug。好的代码风格能够帮我们解决这些问题（typeScript：没错，正是在下！）雾~~ 代码检查是一种静态的分析，常用于寻找有问题的模式或者代码，并且不依赖于具体的编码风格。eslint附有大量开箱即用的配置规则帮助我们检查代码，但每次需要翻阅长长的文档颇为麻烦，我根据网络把大部分能用...
vscode 格式化代码双引号
不看一的博客
03-02 1170
{ "workbench.startupEditor": "newUntitledFile", "terminal.integrated.shell.windows": "C:\\Windows\\System32\\cmd.exe", "vetur.format.defaultFormatterOptions": { "js-beautify-html":...
VSCode Vue代码自动格式化
我笔记
09-12 827
VsCode关于Vue的格式化插件非常多，网上的资料也五花八门，可以使用的非常少, 经过多次探索，终于找到一个可以用的方式。 Prettier-Code formatter 多次探索终于找到一个可用的简单操作的，首先安装Prettier插件 配置代码格式化文件 安装好了以后在项目根目录中添加.prettierrc文件 { "printWidth": 150, "overrides": [ { "files": ".prettierrc", ...
vs code + vue 代码格式化设置
ban0045的博客
05-19 1199
1.安装eslint插件 2.文件-首选项-设置 3.4.插入代码 代码： // An highlighted block { "editor.fontSize": 17, "editor.codeActionsOnSave": { "source.fixAll.eslint": true }, "explorer.confirmDelete": false }
vue开发vscode常用快捷键
yinianzhijian99的专栏
06-23 7039
vscode常用快捷键
vs code 格式化vue设置
Greyscarf的博客
03-02 550
文件—>首选项—>设置—>打开 setting.json。
VSCODE工具支持vue代码格式化设置
qq_21875331的博客
05-18 853
{ // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tabsize "editor.tabSize": 2, // #每次保存的时候自动格式化 "editor.formatOnSave": true, // #每次保存的时候将代码按eslint格式进行修复 "eslint.autoFixOnSave": true, // 添加 vue 支持 "eslint.va.
vscode中vue代码格式化快捷键
最新发布
06-19
在 Visual Studio Code (VSCode) 中，Vue.js 代码格式化通常不是内置的，但你可以安装第三方插件来实现这一功能。Vue官方推荐的插件是 `Prettier` 和 `vetur` 组合，它们提供了 Vue.js 的代码格式化支持。 要设置 ...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值