1、展示效果

如何给vue项目添加eslint呢,如何自动修复呢?

先展示一下效果:

2、配置步骤

1、安装插件ESLint plugin

webstrom 其实有个非常好用的插件,ESLint plugin(如果在先安装不来可以手动下载,下载地址https://plugins.jetbrains.com/plugin/7494-eslint)

2、配置插件

安装完毕后在这里几个地方配置一下:

要注意两点

  • 第二个框是你的项目地址/node_modules/.bin/eslint.cmd
  • 第三个框是.eslintrc.js

配置好后就可以使用了!

第二种方式:全局修复

项目使用的是Vue.js框架,自动校验代码只需要在项目工程下的package.json文件中寻找scripts关键字,

scripts下面有lint关键字

在lint中加入--fix如

然后再打开cmd,在cd到工程目录下,运行:npm run lint

便可自动修改格式,但是也有一些是没法修改的,例如"=="在要求使用"===",还有各种拼写错误啥的这些手动修改一下就好了。

webstrom 配置eslint 自动修复错误的更多相关文章

  1. 配置 ESLint 自动格式化自闭合标签(Self closing tag)

    对于没有子元素或不需要子元素的 HTML 标签,通常写成其自闭合的形式会显得简洁些, - <SomeComponent></SomeComponent> + <SomeC ...

  2. vscode webstrom 配置 eslint 使用 airbnb 规范

    1.安装eslint npm eslint-plugin-react eslint-plugin-import babel-eslint -g 2.全局配置文件,放到c:/user/***/ { &q ...

  3. webstrom配置一键修复ESLint的报错

    因为项目本身有用eslint,而我这边没用,我这边提交上去别人update后就会提示很多eslint的格式错误提示,所以就在该项目里使用了eslint. 发现一般有两种安装方式,我使用的是webstr ...

  4. Webpack 2 视频教程 010 - 配置 ESLint 实现代码规范自动测试 (下)

    原文发表于我的技术博客 这是我免费发布的高质量超清「Webpack 2 视频教程」. Webpack 作为目前前端开发必备的框架,Webpack 发布了 2.0 版本,此视频就是基于 2.0 的版本讲 ...

  5. Webpack 2 视频教程 009 - 配置 ESLint 实现代码规范自动测试 (上)

    原文发表于我的技术博客 这是我免费发布的高质量超清「Webpack 2 视频教程」. Webpack 作为目前前端开发必备的框架,Webpack 发布了 2.0 版本,此视频就是基于 2.0 的版本讲 ...

  6. webstorm配置eslint【标记错误,修复错误】

    项目中经常用到eslint语法,结合个人经验,用webstorm配置eslint "文件"->"默认设置"->"语言&框架&quo ...

  7. VSCode配置eslint

    在Vue.js项目中,使用的是eslint检查. 而在我写完代码后,cnpm run dev运行命令...然后悲剧了,一大堆报错!╮(╯▽╰)╭ 安装插件:Vetur:这是vscode上一个vue.j ...

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

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

  9. webpack中配置eslint

    首先安装eslint npm install eslint --save-dev 安装好这个工具后,初始化eslint npx eslint --init 这个时候会自动生成.eslintrc.js ...

随机推荐

  1. 本地idea开发mapreduce程序提交到远程hadoop集群执行

    https://www.codetd.com/article/664330 https://blog.csdn.net/dream_an/article/details/84342770 通过idea ...

  2. $ 一步一步学Matlab(2)——Matlab基本通用操作

    在上一篇中对Matlab做了一个初步的了解,本文继续来零距离亲身体验Matlab,来感受一下Matlab的一些基本.通用的操作. 命令行窗口 一打开Matlab就能看到命令行窗口,在我所用的这个精简版 ...

  3. 防止常见XSS 过滤 SQL注入 JAVA过滤器filter

    XSS : 跨站脚本攻击(Cross Site Scripting),为不和层叠样式表(Cascading Style Sheets, CSS)的缩写混淆,故将跨站脚本攻击缩写为XSS.恶意攻击者往W ...

  4. tomcat源码调试

    三.tomcat目录结构 tomcat的下载安装有很多教程,不再赘述. 现在的tomcat已经到9了,当tomcat下载安装完成后,其目录大致如下:     除了上面的文件夹,还有四个文件:     ...

  5. timestamp类型在jsp页面输出格式化方法

    jsp页面使用了iterator迭代器,迭代器中有个属性名字为time,其类型为timestamp类型的,至于为什么是这个类型嘛,就是用navicat建好数据库直接映射出来的实体类,所以就是这个类型啦 ...

  6. Docker入门简明教程

    Docker简介 概念 Docker是基于Go语言实现的云开源项目,是基于Linux的多项开源技术提供高效.敏捷和轻量级的容器方案.创建于2013年初.自从开源后就受到了广泛的关注,从长远的眼光来看, ...

  7. 计算mysql 数据库 表大小 服务器传输 小写表明转成大写

    //数据库表存储大小 select table_schema,table_name,table_rows,concat(round(data_length/1024/1024/1024,2),'GB' ...

  8. 编码解码--url编码解码

    url编码解码,又叫百分号编码,是统一资源定位(URL)编码方式.URL地址(常说网址)规定了常用地数字,字母可以直接使用,另外一批作为特殊用户字符也可以直接用(/,:@等),剩下的其它所有字符必须通 ...

  9. [BZOJ1584]Cleaning Up 打扫卫生

    Description 有N头奶牛,每头那牛都有一个标号Pi,1 <= Pi <= M <= N <= 40000.现在Farmer John要把这些奶牛分成若干段,定义每段的 ...

  10. java 反序列化 漏洞

        java在反序列化的时候会默认调用被重写的readObject(ObjectInputStream )方法. 在远程服务端一个需要反序列化的接口中,比如一个web服务,他那个接口调用链中有反序 ...