上个博客说到了如何配置 eslint 和 editorconfig,

但是每次运行项目的时候才能知道哪段代码不符合规范,确实也有点蛋疼。

那么能不能直接在编辑器中就能看到不符合规范的代码的呢???

这不是废话吗,肯定是有的呀。

打开vscode ,搜索插件 eslint

安装插件

安装好了重新打开项目就能用了哦

随便打开一个文件,调整代码如下

如果不符合之前配置eslint规则的,就会出现红色波浪线,鼠标移上去 会显示具体的错误。

怎么样,是不是很牛x呢。

这还不是最牛x的!

但是如果打开一个项目,发现每个文件满屏都是不符合规则的是不是很蛋疼啊。

这就需要eslint 插件更牛x 的功能了,自动修复! 配置好后只需要重新保存一下文件,这个文件就能根据配置的eslint规则自动修改

打开vscode 配置  文件 > 首选项 > 配置  (也可以ctrl+ ,) 搜索eslint ,打开配置文件

在右侧加入 eslint.autoFixOnSave: true

打开需要修复的文件 , ctrl+s 保存文件 ,vscode会自动修复不符合eslint配置规则的文件。

拜了个拜!

vscode 中 eslint 的配置的更多相关文章

  1. vscode 中 eslint 相关配置

    1.设置vue等文件有eslint提示 "eslint.validate": [ "javascript", "javascriptreact&quo ...

  2. vscode 中 eslint prettier 和 eslint -loader 配置关系

    前置 本文将探究 vscode prettier 插件 和 eslint 插件在 vscode 中的配置以及这两者对应的在项目中的配置文件的关系,最后提及 vscode eslint 插件配置与 es ...

  3. VScode中python环境配置

    vscode中python环境配置 想要在vscode中运行python代码必须要告诉vscode使用哪个解释器才行 方法1. 打开命令面板(Ctrl+Shift+P)输入Python: Select ...

  4. vscode中git的配置

    vscode中对git进行了集成,很多操作只需点击就能操作,无需写一些 git 指令. 不过这就需要你对vscode进行配置.下面我会讲到 git 的配置与免密码上传 github VSCode配置g ...

  5. Mycat 在vscode中的开发配置

    mycat是国产目前最被追捧的一款分布式数据库集群软件,有一些公司对数据库和应用都有自己的集群方案,但是更多的是一些面对庞大的数据量,而束手无策. 对于这种问题,我想百分之80遇到的是数据库的瓶颈,所 ...

  6. vscode中eslint airbnb的简单配置

    vscode可以直接在扩展中下载安装eslint,然后,还不能用,需要继续如下步骤: 1.npm install -g eslint 安装完后输入"eslint",有东西出来说明安 ...

  7. vscode中eslint插件的配置-prettier

    用vue-cli构建vue项目,会有个eslint代码检测的安装 可vscode自带代码格式化是prettier格式(右键有格式化文件或alt+shift+f) 这时候要在vscode上装一个esli ...

  8. javascript SDK开发之webpack中eslint的配置

    eslint的好处就不多说了.代码检查,代码报错, 智能提示,让开发人员更规范的撸代码等等. 1.安装依赖 npm install --save-dev eslint eslint-friendly- ...

  9. 解决在vscode中eslint在vue后缀文件中保存时无法自动格式化的问题

    在setting.json中加入如下内容 { "eslint.autoFixOnSave": true, "eslint.validate": [ " ...

随机推荐

  1. centos7的时间同步机制:chrony使用

    配置时间同步方法如下: 1.安装chrony时间同步服务(系统默认安装) #yum install chrony 可以先查询一下是否有安装: [root@localhost etc]# rpm -qa ...

  2. [Android实例] Scroll原理-附ScrollView源码分析 (转载)

    想象一下你拿着放大镜贴很近的看一副巨大的清明上河图, 那放大镜里可以看到的内容是很有限的, 而随着放大镜的上下左右移动,就可以看到不同的内容了 android中手机屏幕就相当于这个放大镜, 而看到的内 ...

  3. 2016.6.21 maven:Failure to transfer ... from ....

    问题描述: 才刚新建的工程,什么都没做,就显示pom.xml有问题,在第一行的标签上 有如下错误: 点击详情: Failure to transfer org.apache.maven:maven-p ...

  4. 13.2 处理静态资源【从零开始学Spring Boot】

    转载:http://blog.csdn.net/linxingliang/article/details/51637052目录(?)[-] 默认资源映射 自定义资源映射 自定义目录 使用外部目录 通过 ...

  5. 微信小程序 - 传参的几种方式

    1. navigator navigator?第一参数&第二参数 .... 在传递页面的options可以拿到传递过来的参数 <navigator url='start-test/sta ...

  6. java thin方式连接oracle数据库

    本文主要描述通过thin方式连接oracle数据库 1.创建web project ,将D:\oracle\product\10.2.0\db_1\jdbc\lib(oracle安装目录)下的ojdb ...

  7. android Gallery2 onPause时候,其背景界面显示黑色

    改动: Src/com/android/gallery3d/app/AbstracGalleryActivity.java OnResume()函数约290行 去掉 mGLRootView.setVi ...

  8. UML--组件图,部署图

    组件图用于实现代码之间的物理结构,详细来说,就是实现代码交互.通过接口,将不同的软件,程序连接在一起. [理解] 1.组件的定义相当广泛,包含:源码,子系统,动态链接库,Activex控件. 2.组件 ...

  9. Ubuntu14.04 x86_64 install Xen

    Recommended reference: https://help.ubuntu.com/community/Xen Step One: Install Ubuntu14.04 on your c ...

  10. Session对象失效的客户端解决方法

    ASP(Active Server Pages)技术的Session对象用于存储用户在对话期间的私有信息.当前用户的Session对象中定义的变量和对象能在页面之间共享,但是不能为应用中其他用户所访问 ...