vscode格式化Vue出现的问题
一、VSCode中使用vetur插件格式化vue文件时,js代码会自动加上冒号和分号
本来就是简写比较方便舒服,结果一个格式化回到解放前
最后找到问题原因:
首先,vetur默认设置是这个样的。也就是很多是用的prettier插件。
解决办法1 (最快的解决办法)
把"vetur.format.defaultFormatter.js": "prettier",改为 "vetur.format.defaultFormatter.js": "vscode-typescript"
参考自 记一次vscode升级后,格式化Vue出现的问题
但是这样就没有用到Prettier这个酷酷的东西,于是自己打算继续研究
解决办法2 (踏实的解决办法)
一打开Prettier官网,阔怕全是英文,还是硬着头皮上
(1)安装
yarn安装
yarn add prettier --dev --exact
或者全局安装
yarn global add prettier
或者npm(当然cnpm也可以)
npm install --save-dev --save-exact prettier
或者全局安装
npm install --global prettier
(2)新建.prettierrc.json配置文件放在vue项目的root目录下(也就是和README.md文件同一目录)
(3)配置.prettierrc.json文件如下
{
"singleQuote":true,//使用单引号而不是双引号,true就是对
"semi":false//在语句结尾处打印分号,false就是不打印
}
小伙伴们还想配置其他参数选项可参考官网Prettier的选项和参数描述
现在按快捷键Shift+Alt+f格式化js代码就不会加上冒号和分号了。
作者相关Vue文章
打赏 衷心的表示感谢
vscode格式化Vue出现的问题的更多相关文章
- vscode格式化Vue出现的问题:单引号变双引号 格式化去掉分号
学习vue框架时,发现在使用vscode格式化vue代码时,出现单引号变成了双引号问题(导致和EsLint要求不一致),从而导致报错!!!!好坑啊!!! 解决方法如下 在文件根目录下创建 .prett ...
- 解决vscode格式化vue文件出现的问题
遇到的问题 使用vscode开发vue项目的时候,格式化vue文件,与自己配置的eslint标准会有冲突. 引号问题:单引号变双引号 分号问题:行末是否加分号.自动加/减分号 当然还会有其他个性化冲突 ...
- VScode格式化vue文件
使用vscode编写vue文件的时候, 发现不能格式化,手动格式化代码,太费劲, 还有可能会出错, 不格式化,有的时候代码编写的时候, 没有很好的管理格式,不美观. 但是我们是可以修改让VScode可 ...
- Vscode 格式化vue Template代码段
1.安装 vetur 2.在User Setting中增加设置: "vetur.format.defaultFormatter.html": "js-beautify-h ...
- vscode 格式化vue代码单引号变双引号
首选项->设置.输入框输入vetur vscode中设置 "vetur.format.defaultFormatterOptions": { "prettier&q ...
- 记一次vscode升级后,格式化Vue出现的问题
一.VSCode中使用vetur插件格式化vue文件时,stylus代码会自动加上大括号.冒号和分号 本来就是简写比较方便舒服,结果一个格式化回到十年前 解决方案: vscode 文件 ->首 ...
- vue项目中vscode格式化配置和eslint配置冲突
问题描述 使用vscode开发vue项目的时候,从远端拉下一个新的项目后,安装完依赖后跑起项目时,发现直接报了一堆语法错误:包括换行.空格.单双引号.分号等各种格式问题 因为我的 vscode 安装使 ...
- vscode对Vue文件的html部分格式化失效问题解决办法
使用vscode编辑vue文件时发现突然格式化代码不会对<template> </template>之间的html生效了,解决办法很简单 文件 --> 首选项 ---&g ...
- 解决VSCode中使用vetur插件格式化vue文件时,js代码会自动加上冒号和分号
解决VSCode中使用vetur插件格式化vue文件时,js代码会自动加上冒号和分号 在设置中把"vetur.format.defaultFormatter.js": " ...
随机推荐
- nginx配置文件中的location理解
关于一些对location认识的误区 1. location 的匹配顺序是"先匹配正则,再匹配普通". 矫正: location 的匹配顺序其实是"先匹配普通,再匹配正则 ...
- remap.config文件配置模板
# # URL Remapping Config File # # Using remap.config allows you to accomplish two things: # # 1) Rew ...
- ROS学习笔记
创建ros工作环境: mkdir -p ~/catkin_ws/src //建立项目目录,同时生成src文件夹 cd ~/catkin_ws/ //进入项目目录 catkin_make //编译项目, ...
- java基础(一) 深入解析基本类型
. 浮点数使用 IEEE(电气和电子工程师协会)格式. 浮点数类型使用 符号位.指数.有效位数(尾数)来表示.要注意一下,尾数的最高 在java中,float 和 double 的结构如下: 类 ...
- 部署eolinker开源版接口管理
想找一个API接口管理的软件,为了安全性和扩展性考虑,希望是开源的,而且可以在内网独立部署.网上翻找了资料,经过一份比对之后,最终采用eolinker.过去有使用过RAP,但是感觉界面实在是太丑了. ...
- mkdir与mkdirs的区别
mkdir与mkdirs的区别 项目中需要在代码中读取或创建文件保存路径,用到了mkdir,查看还有个mkdirs方法,这里记录一下两者的区别. 1.关于两者的说明如下: boolean mkdir( ...
- [Sdoi2017]新生舞会 [01分数规划 二分图最大权匹配]
[Sdoi2017]新生舞会 题意:沙茶01分数规划 貌似\(*10^7\)变成整数更科学 #include <iostream> #include <cstdio> #inc ...
- 调试 smallcorgi/Faster-RCNN_TF 的demo过程遇到的问题
最近在调试faster R-CNN时,遇到了各种各样的问题.使用的算法库为https://github.com/smallcorgi/Faster-RCNN_TF 注:本文使用的是通过virtuale ...
- H-ui.admin v2.3后台模版!
一个很好的 后台开发模板 演示地址 http://demo.h-ui.net/H-ui.admin/3.1/index.html 下载地址 http://downs.h-ui.net/h-ui/H-u ...
- ArrayList源码阅读
前言 数组是我们最常用最简单的数据结构,Java里对数组做了一个简单的包装,就是ArrayList,提供自动扩容的功能. 最常用法 list在我们日常代码中最为常用的做法是创建一个list,放入数据, ...