遇到的问题

使用vscode开发vue项目的时候，格式化vue文件，与自己配置的eslint标准会有冲突。

  • 引号问题：单引号变双引号
  • 分号问题：行末是否加分号。自动加/减分号
  • 当然还会有其他个性化冲突，只需要找到怎么修改，就好办了。

说明

vscode格式化文件，使用的是快捷键shift + alt + f

而我安装了vetur插件来格式化vue文件。

vetur插件默认使用的是prettier来格式化代码。

prettier官网

vetur文档格式化说明：

此时，如果要改变格式化风格，那么需要自定义prettier内容。

操作流程

  1. 安装Prettier-Code formatter插件地址
  2. 打开设置，并配置

在默认设置中找到`prettier.singleQuote`，并将其设置为true。单引号，设置为true；双引号，设置为false。

在默认设置中找到`prettier.semi`,并将其设置为false。末尾需要分号，设置为true；不需要分号，设置为false。

保存设置。之后，再去格式化，就能达到预期的效果。

[完]

解决vscode格式化vue文件出现的问题的更多相关文章

  1. VScode格式化vue文件

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

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

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

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

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

  4. vscode格式化Vue出现的问题

    一.VSCode中使用vetur插件格式化vue文件时,js代码会自动加上冒号和分号 本来就是简写比较方便舒服,结果一个格式化回到解放前 最后找到问题原因: 首先,vetur默认设置是这个样的.也就是 ...

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

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

  6. VSCode新建vue文件自定义模板

    在一个Vue的项目中,反复的新建.vue文件是一个必不可少的工序.本着科技让人偷懒的原则,我们可以利用VSCode的snippet在.vue文件创建后能轻松地生成一套模板. 整个过程是轻松加愉快的,只 ...

  7. vscode添加vue文件模板

    文件->首选项->用户代码片段->输入vue,打开vue.json 添加模板json "Print to console": { "prefix&quo ...

  8. vue --- vscode 配置 .vue文件生成结构

    1.选择“文件 -> 首选项 -> 用户代码片段”,此时,会弹出一个搜索框,输入vue      选择vue后,编辑器会自动打开一个名字为vue.json的文件 2.复制以下内容到这个文件 ...

  9. vscode中使用beautify插件格式化vue文件

    1.点击设置,找到beautify.language并在html一栏里加上vue "beautify.language": { "js": { "ty ...

随机推荐

  1. Java:IO流-流的操作规律和转换流

    首先我们先来了解一些IO流基本知识. 一,基本知识概括 具体的IO流有很多种,针对不同的应用场景应该使用相应的流对象.但怎么确定应该使用哪个IO流对象呢? 一般要有四个明确: 1)明确源和目的 源:I ...

  2. oracle not in 改为 not exist

    修改前 SELECT pageID, permissionID FROM tableA WHERE userID=#{userID} AND projectCode=#{projectCode} AN ...

  3. python之路（11）描述符

    前言 描述符是用于代理另一个类的属性,一般用于大型的框架中,在实际的开发项目中较少使用,本质是一个实现了__get__(),__set__(),__delete__()其中一个方法的新式类 __get ...

  4. IDEA+Maven配置MyBatis的初体验（坑点总结）

    起因 在老师的推荐下,我跟着这篇文章https://www.jb51.net/article/70923.htm尝试MyBatis的初次调试运行.途中困难重重,由于教程中的开发环境是eclipse,项 ...

  5. cmake 递归依赖

    现在有3个模块:main.service.base,main依赖service的service.h.service依赖base的base.h,怎么写CMakeList.txt避免main直接耦合bas ...

  6. Python——使用高德API获取指定城指定类别POI并实现XLSX文件合并

    # 以下内容为原创,转载请注明出处 1 import xlrd # 读xlsx import xlsxwriter # 写xlsx import urllib.request # url请求,Pyth ...

  7. 在Ubuntu下进行XMR Monero(门罗币)挖矿的超详细图文教程

    大家都知道,最近挖矿什么的非常流行,于是我也在网上看了一些大神写的教程,以及跟一些大神请教过如何挖矿,但是网上的教程都感觉写得不够详细,于是今天我这里整理一个教程,希望能够帮到想要挖矿的朋友. 首先, ...

  8. linux内核开发入门学习

    1. 目录结构 内核源代码下载 https://www.kernel.org arch目录 arch是architecture的缩写. 内核所支持的每种CPU体系,在该目录下都有对应的子目录.每个CP ...

  9. .NET尝试访问某方法失败

    今天发现了一个错误: xxxx.xxxx尝试访问xxxx.xxxx方法失败. 调试无果,经过分析后得到这是.NET引用的问题.果然有了这个方向后,发现了引用不匹配的问题,问题随之解决. 记录一下.

  10. DS博客作业02—线性表

    1.思维导图及学习体会 1.1第一章绪论知识点思维导图 1.2.谈谈你对线性表的认识及学习体会. 线性表最重要的就是对指针的操作,插入删除都是看指针的指向进行操作以达到改变节点,以达到目的的.对于上学 ...