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": " ...
随机推荐
- ansible 批量安装zabbix agentd客户端
目录结构 # tree /etc/ansible/ /etc/ansible/ ├── ansible.cfg ├── hosts ├── roles │ └── zabbix-agentd │ ...
- debug时ClassNotFound可能出现的原因
自我总结,欢迎拍砖! 目的:总结ClassNotFound可能出现的原因,方便以后定位该类问题. 原因:当项目中加了新类,debug或run时,报classnotfound,说明没有找到该类的clas ...
- 个性化推荐调优：重写spark推荐api
最近用spark的mlib模块中的协同过滤库做个性化推荐.spark里面用的是als算法,本质上是矩阵分解svd降维,把一个M*N的用户商品评分矩阵分解为M*K的userFeature(用户特征矩阵) ...
- jQuery中的DOM操作------复制及包裹节点
1.复制节点: 如果单击<li>元素后需要再复制一个<li>元素,可以用clone()方法来完成: $(this).clone().appendTo("ul" ...
- Intellij IDEA 15 如何同时打开多个项目
标题:Intellij IDEA 15 如何同时打开多个项目 作者原创技术文章,转载请注明出处 我们在编程时常常需要打开多个项目,例如操作复制黏贴或者参考其他项目等等,但是编译器Intellij ID ...
- JDBC为什么要使用PreparedStatement而不是Statement
PreparedStatement是什么? PreparedStatement是java.sql包下面的一个接口,用来执行SQL语句查询,通过调用connection.preparedStatemen ...
- BZOJ 4259: 残缺的字符串 [FFT]
4259: 残缺的字符串 题意:s,t,星号任意字符,匹配方案数 和上题一样 多乘上一个\(a_{j+i}\)就行了 #include <iostream> #include <cs ...
- WebSocket 示例
websocket应运而生 在WebSocket规范提出之前,开发人员若要实现带有即时通信.实时数据.订阅推送等功能的应用实时性较强的功能,经常会使用的解决方法是 Comet. Comet是一种服务器 ...
- ASP.NET Core 入门
关于ASP.NET Core ASP.NET Core 是一个全新的开源.跨平台框架,可以用它来构建基于网络连接的现代云应用程序,比如:Web 应用,IoT(Internet Of Things,物联 ...
- JDBC【数据库连接池、DbUtils框架、分页】
1.数据库连接池 什么是数据库连接池 简单来说:数据库连接池就是提供连接的... 为什么我们要使用数据库连接池 数据库的连接的建立和关闭是非常消耗资源的 频繁地打开.关闭连接造成系统性能低下 编写连接 ...