一、全局安装

npm install -g eslint

二、生成配置文件

  在项目根目录执行init,生成.eslintrc文件。在init时,要求根目录存在package.json。当然也可以直接复制个现成的.eslintrc.js文件。

eslint --init

三、自定义配置项

  根据规则文档,编辑.eslintrc.js文件内容。

module.exports = {
"env": {
"node": true
},
"rules": {
// 强制使用一致的缩进
"indent": ["warn", "tab"],
// 禁止空格和 tab 的混合缩进
"no-mixed-spaces-and-tabs":1,
// 禁用 debugger
"no-debugger": 1,
// 禁止不必要的布尔转换
"no-extra-boolean-cast": 1,
// 强制所有控制语句使用一致的括号风格
"curly": 1,
// 禁止使用多个空格
"no-multi-spaces": 1,
// 要求在函数标识符和其调用之间有空格
"func-call-spacing": 1,
// 强制在函数括号内使用一致的换行
"function-paren-newline": ["warn", "never"],
// 强制隐式返回的箭头函数体的位置
"implicit-arrow-linebreak": 1,
// 强制在对象字面量的属性中键和值之间使用一致的间距
"key-spacing": 1,
// 强制在关键字前后使用一致的空格
"keyword-spacing":1,
// 要求调用无参构造函数时有圆括号
"new-parens":1,
// 禁止出现多行空行
"no-multiple-empty-lines":1,
// 要求使用分号代替 ASI
"semi":["warn","always"],
// 要求操作符周围有空格
"space-infix-ops":1
}
};

  配置内容也可以写在package.json中,具体规则也是写在rules里。有时用vue-cli生成的项目会在package.json里看到这样的配置:

  "eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"rules": {},
"parserOptions": {
"parser": "babel-eslint"
}
}

四、执行检查并修改

eslint * --fix

ESLint 使用方法的更多相关文章

  1. Webpack干货系列 | 在 Webpack 5 集成 ESLint 的方法

    程序员优雅哥(youyacoder)简介:十年程序员,呆过央企外企私企,做过前端后端架构.分享vue.Java等前后端技术和架构. 本文摘要:主要讲解运用Webpack 5 中集成 ESLint 的方 ...

  2. 在Vue中关闭Eslint 的方法

    在vue项目中关闭ESLint方法:找到 webpack.base.conf.js 将这些代码注释掉, { test: /\.(js|vue)$/, loader: 'eslint-loader', ...

  3. Visual Studio Code 格式化ESlint 的方法

    既然要格式化ESlint,就不得不先介绍一下什么是ESlint.后面再介绍格式化的方法 1.ESlint ESLint 是在 ECMAScript/JavaScript 代码中识别和报告模式匹配的工具 ...

  4. vue项目中关闭eslint的方法

    非常简单的操作方法!不用再去为了烦人的代码标准报错而苦恼了! 方法一:在项目根目录下增加 vue.config.js 文件 添加以下代码: module.exports = { lintOnSave: ...

  5. 一统江湖的大前端(5)editorconfig + eslint——你的代码里藏着你的优雅

    <一统江湖的大前端>系列是自己的前端学习笔记,旨在介绍javascript在非网页开发领域的应用案例和发现各类好玩的js库,不定期更新.如果你对前端的理解还是写写页面绑绑事件,那你真的是有 ...

  6. vue-cli关闭eslint及配置eslint

    有了eslint的校验,可以来规范开发人员的代码,是挺好的.但是有些像缩进.空格.空白行之类的规范,在开发过程中一直报错,有点烦人了. 我们可以在创建工程的时候选择不要安装eslint.就是在安装工程 ...

  7. ESLint - 简介

    ESLint是一个QA工具,用来避免低级错误和统一代码的风格. ESLint被设计为完全可配置的,主要有两种方式来配置ESLint: 在注释中配置:使用JavaScript注释直接把配置嵌入到JS文件 ...

  8. 【AST篇】教你如何编写 Eslint 插件

    前言 虽然现在已经有很多实用的 ESLint 插件了,但随着项目不断迭代发展,你可能会遇到已有 ESLint 插件不能满足现在团队开发的情况.这时候,你需要自己来创建一个 ESLint 插件. 本文我 ...

  9. vue-cli3项目配置eslint代码规范

    前言 最近接手了一个项目,由于之前为了快速开发,没有做代码检查.为了使得代码更加规范以及更易读,所以就要eslint上场了. 安装依赖 安装依赖有两种方法: 1. 在cmd中打上把相应的依赖加到dev ...

随机推荐

  1. Excel的合并解析

    相关文件我放到如下链接: http://files.cnblogs.com/files/DreamDrive/Excel%E5%90%88%E5%B9%B6%E8%A7%A3%E6%9E%90.rar ...

  2. (转)linux top命令中各cpu占用率含义及案例分析

    原文:https://blog.csdn.net/ydyang1126/article/details/72820349 linux top命令中各cpu占用率含义 0 性能监控介绍 1 确定应用类型 ...

  3. Asp.Net Core 集成 Hangfire 配置使用 Redis 存储

    Hangfire 官方支持 MSSQL 与 Redis(Hangfire.Pro.Redis) 两种 ,由于我的数据库是 MYSQL ,粗略查询了一下文档,现在对 .NET Core 支持的并不够好, ...

  4. vue子组件传参给父组件

    关于父组件传参给子组件,可以看我另一篇文章 教程开始: 我们要实现的效果是:在子组件的Input框输入,父组件中实时更新显示.(也就是把子组件中的数据传给父组件) 一.子组件代码 template部分 ...

  5. react项目中使用antd

    1.antd官网: https://ant.design/docs/react/introduce-cn 2.React中使用Antd 1.安装antd npm install antd --save ...

  6. 用Javascript开发网页截屏插件

    实现思路用html2canvas.js将元素转换成canvas,在将canvas转成图片. html2canvas(document.body, { onrendered: function(canv ...

  7. hibernate对连接池的支持和HQL查询

    hibernate对连接池的支持 连接池, 作用: 管理连接:提升连接的利用效率! 常用的连接池: C3P0连接池 Hibernate 自带的也有一个连接池,且对C3P0连接池也有支持! 只维护一个连 ...

  8. Andrew Ng机器学习课程笔记(六)之 机器学习系统的设计

    Andrew Ng机器学习课程笔记(六)之 机器学习系统的设计 版权声明:本文为博主原创文章,转载请指明转载地址 http://www.cnblogs.com/fydeblog/p/7392408.h ...

  9. redis学习(四)redis事务

    redis事务 1.redis事务介绍 redis的事务可以理解为一系列串行命令的集合.redis的事务和单条命令一样,都是redis的最小执行单位,因此一个事务内的命令,要么全部执行,要么全部不执行 ...

  10. C#根据byte前两位获取图片扩展名

    C#根据byte前两位获取图片扩展名 /// <summary> /// 根据byte前两位获取图片扩展名 /// </summary> /// <param name= ...