一、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文章

基于Vue2.0实现后台系统权限控制

前端文档汇总

VUE2.0增删改查附编辑添加model(弹框)组件共用

打赏 衷心的表示感谢

vscode格式化Vue出现的问题的更多相关文章

  1. vscode格式化Vue出现的问题:单引号变双引号 格式化去掉分号

    学习vue框架时,发现在使用vscode格式化vue代码时,出现单引号变成了双引号问题(导致和EsLint要求不一致),从而导致报错!!!!好坑啊!!! 解决方法如下 在文件根目录下创建 .prett ...

  2. 解决vscode格式化vue文件出现的问题

    遇到的问题 使用vscode开发vue项目的时候,格式化vue文件,与自己配置的eslint标准会有冲突. 引号问题:单引号变双引号 分号问题:行末是否加分号.自动加/减分号 当然还会有其他个性化冲突 ...

  3. VScode格式化vue文件

    使用vscode编写vue文件的时候, 发现不能格式化,手动格式化代码,太费劲, 还有可能会出错, 不格式化,有的时候代码编写的时候, 没有很好的管理格式,不美观. 但是我们是可以修改让VScode可 ...

  4. Vscode 格式化vue Template代码段

    1.安装 vetur 2.在User Setting中增加设置: "vetur.format.defaultFormatter.html": "js-beautify-h ...

  5. vscode 格式化vue代码单引号变双引号

    首选项->设置.输入框输入vetur vscode中设置 "vetur.format.defaultFormatterOptions": { "prettier&q ...

  6. 记一次vscode升级后,格式化Vue出现的问题

    一.VSCode中使用vetur插件格式化vue文件时,stylus代码会自动加上大括号.冒号和分号 本来就是简写比较方便舒服,结果一个格式化回到十年前 解决方案: vscode  文件 ->首 ...

  7. vue项目中vscode格式化配置和eslint配置冲突

    问题描述 使用vscode开发vue项目的时候,从远端拉下一个新的项目后,安装完依赖后跑起项目时,发现直接报了一堆语法错误:包括换行.空格.单双引号.分号等各种格式问题 因为我的 vscode 安装使 ...

  8. vscode对Vue文件的html部分格式化失效问题解决办法

    使用vscode编辑vue文件时发现突然格式化代码不会对<template> </template>之间的html生效了,解决办法很简单 文件 --> 首选项 ---&g ...

  9. 解决VSCode中使用vetur插件格式化vue文件时,js代码会自动加上冒号和分号

    解决VSCode中使用vetur插件格式化vue文件时,js代码会自动加上冒号和分号 在设置中把"vetur.format.defaultFormatter.js": " ...

随机推荐

  1. 【转】awk内置变量

    awk是个优秀文本处理工具,可以说是一门程序设计语言.下面是awk内置变量. 一.内置变量表 属性 说明 $0 当前记录(作为单个变量) $1~$n 当前记录的第n个字段,字段间由FS分隔 FS 输入 ...

  2. 2018-01-05-医药行业的IT革命探讨

    layout: post title: 2018-01-05-医药行业的IT革命探讨 key: 20180105 tags: IT AI 医疗 modify_date: 2018-01-05 --- ...

  3. MVVM之旅(1)创建一个最简单的MVVM程序

    这是MVVM之旅系列文章的第一篇,许多文章和书喜欢在开篇介绍某种技术的诞生背景和意义,但是我觉得对于程序员来说,一个能直接运行起来的程序或许能够更直观的让他们了解这种技术.在这篇文章里,我将带领大家一 ...

  4. 不干胶打印机 www.bgjdyj.com

    不干胶打印机如何保养 不干胶打印机专卖网根据多年的维修经验总结了以下几种保养不干胶打印机的方法: 1.不干胶打印机打印机标签纸不能搁置太长时间,第一容易起静电.第二容易起灰尘2.不干胶打印机的打印头最 ...

  5. 配置redis开机自启动和监听

    redis安装好后,每次手动启动很不方便,配置开机自启动. 方法一:设置启动命令到/etc/rc.d/rc.local rc.local文件是系统全局脚本文件,会在其他开机进程脚本文件执行完毕后执行该 ...

  6. JAVA设计模式---迭代器模式

    1.定义: 提供一种方法顺序访问一个聚合对象中的各个元素,而又不暴露其内部的表示. 2.实例:1)需求: 菜单(煎饼屋菜单.餐厅菜单和咖啡菜单)采用不同的集合存取(ArrayList,String[] ...

  7. Python之Django rest_Framework(3)

    补充:  为什么要前后端分离:       a.因为前端它有自己框架,这样它的效率就非常高       b.不做前后端分离,公司如果既有客户端,又有app这种情况下你就的写两遍 django rest ...

  8. CentOS7 Nvidia Docker环境

    最近在搞tensorflow的一些东西,话说这东西是真的皮,搞不懂.但是环境还是磕磕碰碰的搭起来了 其实本来是没想到用docker的,但是就一台配置较好电的服务器,还要运行公司的其他环境,vmware ...

  9. Java版网络爬虫基础

    网络爬虫不仅仅可以爬取网站的网页,图片,甚至可以实现抢票功能,网上抢购,机票查询等.这几天看了点基础,记录下来. 网页的关系可以看做是一张很大的图,图的遍历可以分为深度优先和广度优先.网络爬虫采取的广 ...

  10. 简述TCP网络编程本质

    基于事件的非阻塞网络编程是编写高性能并发网络服务程序的主流模式,头一次使用这种模式编程需要转换思维模式 .把原来的"主动调用recv()来接收数据,主动调用accept()来接受连接,主动调 ...