项目中配置了eslint后,在使用vue界面里格式化的时候总是不一致。然后在配置中加了配置也无效(File - Preference - Setting)

查了下原因是在vue开发的时候我们一般都安装了Vetur的插件来对.vue格式的文件进行处理,Vetur自带了格式化,规范就是使用prettier

这时候装prettier插件,并且在设置或setting.json里配置了prettier的话是无效的

解决方法:在setting.json中加入下面的配置就可以了

{
"vetur.format.defaultFormatterOptions": {
"prettier": {
"semi": false,
"singleQuote": true
},
"wrap_attributes": "force-aligned"
},
"javascript.format.insertSpaceBeforeFunctionParenthesis": true,
"vetur.format.defaultFormatter.js": "vscode-typescript",
"vetur.format.defaultFormatter.html": "js-beautify-html"
}

但是这个时候会发现vue文件是可以了,可以js文件还是无效,找到以下方法解决之:

1、安装prettier插件

npm install --save-dev  prettier

2、在根目录新增 .prettierrc.json文件,配置如下:

{
"singleQuote":true,//使用单引号而不是双引号,true就是对
"semi":false//在语句结尾处打印分号,false就是不打印
}

亲测有效,直接Shift + Alt +F就可以美滋滋的格式化代码不会加上冒号和分号啦~

vscode 格式化代码 与 eslint 有冲突的问题解决的更多相关文章

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

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

  2. vscode格式化代码插件Beautify

    vscode格式化代码安装 VsCode 格式化代码插件搜索并安装 Beautify 格式化代码插件使用:打开要格式化的文件 —> F1 —> Beautify file —> 选择 ...

  3. VScode 格式化代码保存时使用ESlint修复代码

    前言 eslint  vs code 新买的电脑啊啊西 装VScode 配置格式化代码保存时使用ESlint修复代码头快炸了,不建议初学者用,太费时间了: 终于搞定---再也不要担心缩进,函数(名)和 ...

  4. vscode格式化代码无效--可能的解决方法

    因为vscode默认启用了根据文件类型自动设置tabsize的选项,因此,可以通过关闭自动设置选项,防止格式覆盖.在用户设置里添加如下配置即可: "editor.detectIndentat ...

  5. vscode如何配置ts的lint,如何配置才能让eslint和prettier不冲突一键格式化代码(vue开发使用)

    最近在使用ts,发觉tslint在vscode上使用很不方便,不如eslint一键格式化高效,就想着能不能配置下vscode让其像写js一样爽 这篇文章主要解决2个问题,第一个是如何让vscode使用 ...

  6. vscode保存代码,自动按照eslint规范格式化代码设置

    # vscode保存代码,自动按照eslint规范格式化代码设置 编辑器代码风格一致,是前端代码规范的一部分.同一个项目,或者同一个小组,保持代码风格一致很必要.就拿vue项目来说,之前做的几个项目, ...

  7. vsCode 设置vue 保存自动格式化代码

    setting { // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tab ...

  8. VScode格式化ESlint

    打开 文件-首选项- 设置 mac可以按快捷键(command和,) 然后在右上角的省略号选择open setting json { // vscode默认启用了根据文件类型自动设置tabsize的选 ...

  9. 03.ElementUI源码学习:代码风格检查和格式化配置(ESlint & Prettier)

    书接上文.在团队协作中,为避免低级Bug.以及团队协作时不同代码风格对彼此造成的困扰与影响,会预先制定编码规范.使用 Lint工具和代码风格检测工具,则可以辅助编码规范执行,格式化代码,使样式与规则保 ...

随机推荐

  1. 【ZooKeeper系列】2.用Java实现ZooKeeper API的调用

    温馨提示:在这里我再次提个小要求,希望大家能习惯看官方文档,文档虽然是英文但用词都比较简单,基本都能看懂文档表达的意思.授之以鱼不如授之以渔的道理相信大家都明白,也希望通过猿人谷的这个ZooKeepe ...

  2. 使用CleanWebpackPlugin插件报错原因:CleanWebpackPlugin is not a constructor

    // webpack版本:4.32.2 // 抛错原写法 const CleanWebpackPlugin = require("clean-webpack-plugin"); . ...

  3. 《一头扎进》系列之Python+Selenium框架设计篇2- 价值好几K的框架,不看白不看,看了还想看

    1. 简介 上一篇介绍了自动化框架的架构,今天宏哥就带领小伙伴或者童鞋们开始开工往这个框架里开始添砖加瓦.主要是介绍一个框架unittest单元测试框架和一种设计思想POM. 2. unittest单 ...

  4. 【朝花夕拾】Android多线程之(三)runOnUiThread篇——程序猿们的贴心小棉袄

    runOnUiThread()的使用以及原理实在是太简单了,简单到笔者开始都懒得单独开一篇文章来写它.当然这里说的简单,是针对对Handler比较熟悉的童鞋而言的.不过麻雀虽小,五脏俱全,runOnU ...

  5. 骚年,如果你还不懂一些java常识?中了奖也无法兑换

    今天下午约着几个朋友一起去看叶问4,结果碰到了一个有趣的事情,正好和java有关所以写一篇文章来记录一下. 事件:我和朋友小李.小王一起去看电影 时间:2019/12/21 地点:H市某家电影院 起因 ...

  6. C#使用WebClient时,如果状态码不为200时,如何获取请求返回的内容

    目录 一.事故现场 二.解决方法 一.事故现场 使用WebClient发送请求,如果返回的状态码不是2xx或3xx,那么默认情况下会抛出异常, 那如何才能获取到请求返回的内容呢? 二.解决方法 可以通 ...

  7. 探索JAVA并发 - 可重入锁和不可重入锁

    本人免费整理了Java高级资料,涵盖了Java.Redis.MongoDB.MySQL.Zookeeper.Spring Cloud.Dubbo高并发分布式等教程,一共30G,需要自己领取.传送门:h ...

  8. utf8和utf8mb4的区别

    一.简介 MySQL在5.5.3之后增加了这个utf8mb4的编码,mb4就是most bytes 4的意思,专门用来兼容四字节的unicode.好在utf8mb4是utf8的超集,除了将编码改为ut ...

  9. 牛客国庆训练 H.千万别用树套树

    链接https://ac.nowcoder.com/acm/contest/1108/H 国庆队内训练的题,当时还完全没思路,就没补.现在会树状数组了,倒是能想一想,不过网上题解好多用线段树传数组的? ...

  10. 2019年腾讯PHP程序员面试题目分享

    有需要学习交流的友人请加入交流群的咱们一起,有问题一起交流,一起进步!前提是你是学技术的.感谢阅读! 点此加入该群​jq.qq.com 1. php 的垃圾回收机制 PHP 可以自动进行内存管理,清除 ...