前言

eslint  vs code

新买的电脑啊啊西 装VScode 配置格式化代码保存时使用ESlint修复代码头快炸了,不建议初学者用,太费时间了;

终于搞定~~~再也不要担心缩进,函数(名)和后面的括号之间没空格啦,代码末尾有分号了,

首先 下载插件  Prettier - Code formatter

然后 设置中配置settings.json

代码:

{
"editor.lineNumbers": "on", //开启行数提示
"editor.quickSuggestions": { //开启自动显示建议
"other": true,
"comments": true,
"strings": true
},
"prettier.useTabs": true,//使用制表符缩进
"editor.tabSize": 2, //制表符符号eslint
"editor.formatOnSave": true, //每次保存自动格式化
"prettier.semi": true, //去掉代码结尾的分号
"prettier.singleQuote": true, //使用单引号替代双引号
"prettier.trailingComma": "none", //去除对象最末尾元素跟随的逗号
"javascript.format.insertSpaceBeforeFunctionParenthesis": true, //让函数(名)和后面的括号之间加个空格
"vetur.format.defaultFormatter.html": "js-beautify-html", //格式化.vue中html
"vetur.format.defaultFormatter.js": "vscode-typescript", //让vue中的js按编辑器自带的ts格式进行格式化
"[vue]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"eslint.run": "onSave",
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"prettier.printWidth": 200,//指定代码长度,超出换行
"prettier.requireConfig": true,//需要prettier.requireConfig格式化
"prettier.useEditorConfig": false,
"eslint.validate": [
//开启对.vue文件中错误的检查
 "javascript",
"javascriptreact",
 {
"language": "html",
 "autoFix": true
 },
 {
 "language": "vue",
 "autoFix": true
 }
 ],
"terminal.integrated.rendererType": "dom",
"[typescript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
}
}

VScode 格式化代码保存时使用ESlint修复代码的更多相关文章

  1. vscode编辑如何保存时自动校准eslint规范

    在日常开发中,一个大点的项目会有多人参与,那么可能就会出现大家的代码风格不一,各显神通,这个时候就要祭出我们的eslint. 在这之前磨刀不误砍柴工,我们先来配置一下我们的代码编辑工具,如何在vsco ...

  2. vscode代码保存时自动格式化成ESLint风格(支持VUE)

    一.问题 vscode的默认的代码格式化ctrl+shift+f 无法通过eslint的代码风格检查是一个非常蛋疼的问题 同样在进行vue项目开发的时候,使用eslint代码风格检查是没啥问题的,但是 ...

  3. vscode 代码保存时自动格式化成 ESLint 风格

    vscode 的默认的代码格式化 alt+shift+f (windows) 无法通过 eslint 的代码风格检查,,, 比如: 4个空格和2个空格(ESLint) 字符串用单引号(ESLint) ...

  4. vue表格中显示金额格式化与保存时格式化为数字并校验!

    最近项目中遇到了成本计算的,需要显示金额,保存一下,以后方便直接拿来用! 一 数字转金额格式显示 //数字转金额格式 format:function(s){ if(/[^0-9\.]/.test(s) ...

  5. sonar做代码检测时如何忽略一些代码文件

    1.管理员登录sonar 2.如图 一条规则配置一个,不要填写逗号或者分号分割的多个规则

  6. vs code python保存时pylint提示"Unable to import 'flask'"

    在配置vscode python开发环境时,编写如下代码并保存时,会提示Unable to import 'flask' from flask import Flask app = Flask(__n ...

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

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

  8. vscode 使用ESLint 自动检查,保存时自动格式化

    1:全局安装eslint `npm install -g eslint`2: 打开vscode 点击 “文件”----->“首选项”---->“设置”,在右侧“用户设置/settings. ...

  9. vscode代码格式化快捷键及保存时自动格式化

    一.实现vs code中代码格式化快捷键:[Shift]+[Alt]+ F 二.实现保存时自动代码格式化: 1)文件 ------.>[首选项]---------->[设置]: 2)搜索  ...

随机推荐

  1. python常用包

    今日所得 collections模块 时间模块 random模块 os模块 sys模块 序列化模块 subprocess模块 collections模块 namedtuple:具名元组 #定义方式一: ...

  2. IOC @Autowired/@Resource/@Qulified的用法实例

    首先要知道另一个东西,default-autowire,它是在xml文件中进行配置的,可以设置为byName.byType.constructor和autodetect:比如byName,不用显式的在 ...

  3. Java IO: PipedInputStream

    原文链接 作者: Jakob Jenkov 译者: 李璟(jlee381344197@gmail.com) PipedInputStream可以从管道中读取字节流数据,代码如下: 01 InputSt ...

  4. [LC] 235. Lowest Common Ancestor of a Binary Search Tree

    Given a binary search tree (BST), find the lowest common ancestor (LCA) of two given nodes in the BS ...

  5. IPFS问题总结

    1.安装包下载 ipfs安装版本下载:https://github.com/ipfs/go-ipfs/releases,这是IPFS的go语言实现版,目前实现的还有js版本. 2.安装与启动 linu ...

  6. CF_Edu.#51_Div.2_1051F_The Shortest Statement

    F. The Shortest Statement time limit per test:4 seconds memory limit per test:256 megabytes input:st ...

  7. 默认的Settings.xml文件(无修改过)-Maven

    Tip: 当什么都不作修改时,默认是从Maven中央仓库进行下载,https://repo.maven.apache.org/maven2. 打开maven源码下的lib文件夹,找到maven-mod ...

  8. Readings

    1984 ([英] 乔治·奥威尔) 这书看完我觉得这根本就是一本恐怖小说,当里面的内容正在和将要发生的时候你就不会觉得里面的描述有点搞笑了.不过看到后面有译者的补充内容说和其他国家的朋友讨论的时候, ...

  9. Swift 浅谈Struct与Class

    讨论Struct与Class之前,我们先来看一个概念:Value Type(值类型),Reference Type(引用类型): 1. 值类型的变量直接包含他们的数据,对于值类型都有他们自己的数据副本 ...

  10. 杂记:OSX下编译安装最新版RedisDesktopMmanager

    之前使用Redis数据库时因为操作简单,一直使用的是“redis-cli”连接Redis:后来因为数据展示的不是很直观,所以开始使用带有图形界面的Redis客户端:RedisDesktopMmanag ...