eslint是一个代码检测工具
官网如下
http://eslint.cn/

npm install eslint --save-dev

需要这几个npm包:

  • eslint

  • eslint-loader

  • eslint-plugin-html (用以lint一些在html文件里面通过script包裹的js代码,它默认的匹配规则是不带type属性,或者是/^(application|text)/(x-)?(javascript|babel|ecmascript-6)$/i,具体的内容请查阅相关文档,通过cli启动lint的时候定义文件后缀名时eslint --ext .html,.js)

  • eslint-config-standard (和?2个包都是javascript-style-standard风格指南需要的包)

  • eslint-plugin-promise

  • eslint-plugin-standard

  • eslint-friendly-formatter (生成的报告格式)

eslint --init

//初始化配置
eslint --init

ESLint 支持几种格式的配置文件:

JavaScript - 使用 .eslintrc.js 然后输出一个配置对象。
YAML - 使用 .eslintrc.yaml 或 .eslintrc.yml 去定义配置的结构。
JSON - 使用 .eslintrc.json 去定义配置的结构,ESLint 的 JSON 文件允许 JavaScript 风格的注释。
Deprecated - 使用 .eslintrc,可以使 JSON 也可以是 YAML。
package.json - 在 package.json 里创建一个 eslintConfig属性,在那里定义你的配置。

如果同一个目录下有多个配置文件,ESLint 只会使用一个。优先级顺序如下:

**1. .eslintrc.js

  1. .eslintrc.yaml

  2. .eslintrc.yml

  3. .eslintrc.json

  4. .eslintrc

  5. package.json**

配置示例

evn设置环境定义了预定义的全局变量

http://eslint.cn/docs/user-gu...

parser设置解释器

http://eslint.cn/docs/user-gu...

global设置全局变量

http://eslint.cn/docs/user-gu...

rules自定义规则

http://eslint.cn/docs/user-gu...

  • "off" 或 0 - 关闭规则

  • "warn" 或 1 - 开启规则,使用警告级别的错误:warn (不会导致程序退出)

  • "error" 或 2 - 开启规则,使用错误级别的错误:error (当被触发的时候,程序会退出)

 module.exports = {
"parser": "babel-eslint",
"extends": "eslint:recommended",
"plugins": [
"html"
],
"env": {
"browser": true,
"node": true,
"es6":true,
"jquery":true
},
"globals": {
"Vue": true,
"AMap": true,
"tdist": true,
"EXIF": true,
"j_body": true,
"native": true,
"VueRouter": true,
"pocketPost": true,
"aliCnCityList": true,
},
"rules": {
"no-unused-vars": ["off", { "vars": "all", "args": "after-used", "ignoreRestSiblings": false }],
"no-debugger": ["off"],
"no-unreachable": ["off"],
"no-console": ["off"],
"no-extra-semi": ["off"],
}
};

eslint在webpack2配置如下

 module: {
rules: [
{
test: /\.(js|vue)$/,
loader: 'eslint-loader',
// enforce: 'pre',//是否在loader前监测,vue中我设为否
include: [path.join(__dirname, 'src')],
options: {
formatter: require('eslint-friendly-formatter')//错误输出格式
}
}
]
}

相关参考文档

https://segmentfault.com/a/11...
http://eslint.cn/docs/user-gu...
http://eslint.cn/docs/rules/

vue-loader

https://vue-loader.vuejs.org/...

https://vue-loader.vuejs.org/...

小无路博客:https://56way.com

eslint webpack2 vue-loader配置的更多相关文章

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

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

  2. webpack4.x 从零开始配置vue 项目(二)基础搭建loader 配置 css、scss

    序 上一篇已经把基本架子搭起来了,现在来增加css.scss.自动生成html.css 提取等方面的打包.webpack 默认只能处理js模块,所以其他文件类型需要做下转换,而loader 恰恰是做这 ...

  3. Vue Loader

    介绍 允许为 Vue 组件的每个部分使用其它的 webpack loader,例如在 <style> 的部分使用 Sass 和在 <template> 的部分使用 Pug(模板 ...

  4. ESLint在vue中的使用

    ESLint的用途 1.审查代码是否符合编码规范和统一的代码风格: 2.审查代码是否存在语法错误:  中文网地址 http://eslint.cn/ 使用VSCode编译器在Vue项目中的使用 在初始 ...

  5. vue 快速入门 系列 —— vue loader 下

    其他章节请看: vue 快速入门 系列 vue loader 下 CSS Modules CSS Modules 是一个流行的,用于模块化和组合 CSS 的系统.vue-loader 提供了与 CSS ...

  6. vue 快速入门 系列 —— vue loader 扩展

    其他章节请看: vue 快速入门 系列 vue loader 扩展 在vue loader一文中,我们学会了从零搭建一个简单的,用于单文件组件开发的脚手架.本篇将在此基础上继续引入一些常用的库:vue ...

  7. 如何在你的Vue项目配置vux

    做移动端项目的话vue现在是首要的选择,足够轻便,文档足够全,当然用的人多,项目中遇到的坑别人可能也遇到过,解决起来也比较方便,至于在开发中做需要的移动端组件库,个人比较推崇vux. 其实项目里组件库 ...

  8. vue 快速入门 系列 —— vue loader 上

    其他章节请看: vue 快速入门 系列 vue loader 上 通过前面"webpack 系列"的学习,我们知道如何用 webpack 实现一个不成熟的脚手架,比如提供开发环境和 ...

  9. vue全局配置----小白基础篇

    今天学习vue全局配置.希望帮助我们去了解vue的全局配置,快速开发. Vue.config是vue的全局配置对象.包含Vue的所有全局属性: silent:boolean(默认值:false)--- ...

随机推荐

  1. 使用mui框架开发App,当input获取焦点时,键盘弹出,底部导航栏上升。

    转自 https://blog.csdn.net/elementFei/article/details/72917393 感谢 问题: 使用mui框架开发App,当input获取焦点时,键盘弹出,底部 ...

  2. transcription-coupled repair|Germ|HK|TS|Mutation|四类变异

    生命组学-可遗传变异 GC content:碱基: GC content不同的植物对应的gene length,可看作上图的转置: 由GC content看出来碱基变异程度,可以找到对应碱基改变,所以 ...

  3. 网站爬取-案例三:今日头条抓取(ajax抓取JS数据)

    今日头条这类的网站制作,从数据形式,CSS样式都是通过数据接口的样式来决定的,所以它的抓取方法和其他网页的抓取方法不太一样,对它的抓取需要抓取后台传来的JSON数据,先来看一下今日头条的源码结构:我们 ...

  4. win10//ubuntu安装tensorflow-gpu与kears,并用minist测试

    WIn10 安装cuda 先安装VS,然后根据自己的版本安装CUDA. 安装完后,打开cmd命令行输入nvcc -V,检测是否安装成功 安装cuDDN 安装对应版本,解压后覆盖到CUDA的地址,默认为 ...

  5. 项目部署篇之三——安装tomcat7.0

    1.下载tomcat 百度云下载 链接:https://pan.baidu.com/s/1UGPYHmR-1ehQRvdKGhSlyQ 提取码:3c0g 直接通过指令下载 wget http://mi ...

  6. WEB-文件包含漏洞详解

    title date tags layout 文件包含漏洞(File Include) 2018-10-12 post 产生原因: 由于在编写代码时避免麻烦就需要把公用的一段代码写到一个单独的文件里面 ...

  7. android流式布局、待办事项应用、贝塞尔曲线、MVP+Rxjava+Retrofit、艺术图片应用等源码

    Android精选源码 android模仿淘宝首页效果源码 一款艺术图片应用,采用T-MVVM打造 Android MVP + RxJava + Retrofit项目 android流式布局实现热门标 ...

  8. swift中的category,扩展

    1.创建选择 :swift file 2.名称:UIBarButtonItem-Extension 3.category,便利构造函数 extension UIColor { /* 1.extensi ...

  9. 数据库连接中断-spring-springBoot

    问题:据库和应用在同一台机,数据库用mysql5.6.20,已经升级druid到最新的1.0.7版本,访问的是localhost的mysql,放一个晚上不访问,第二天访问就报错了,重启服务正常,错误提 ...

  10. <JZOJ4726>种花

    挺有意思的贪心 神奇的贪心 #include<cstdio> #include<iostream> #include<cstring> #include<al ...