eslint在vuecli中的使用

.editorconfig 文件详细备注

# 最顶级的配置,相当于根 editorconfig 直到查找到root=true 才会停止查找不然会一直向上查找
root = true
# 通配符 表示匹配/之外任意字符串
[*]
#编码格式
charset = utf-8
# tab 表示hard-tab 硬件tab 是一个tab键 / space表示soft-tab 软件tab 是四个空格space
indent_style = space
# index_style设置了space 就由index_size来定义每级缩进列数 如果设置tab 则需要tab_width 属性来设置
indent_size = 2
#定义换行符，支持lf、cr和crlf。
end_of_line = lf
#设为true表明使文件以一个空白行结尾，false反之
insert_final_newline = true
#设为true表示会除去换行行首的任意空白字符，false反之。
trim_trailing_whitespace = true

.eslintignore文件

这个文件的作用与gitignore类似，列入这个文件里的文件或者目录，eslint将会忽略，不会检查。

*.md
MyComponents.vue

.eslintrc.js 文件配置

官方文档：https://eslint.bootcss.com/docs/user-guide/configuring#extending-configuration-files

module.exports = {
    // 默认情况下，ESLint会在所有父级组件中寻找配置文件，一直到根目录。ESLint一旦发现配置文件中有   "root": true，它就会停止在父级目录中寻找。
    root: true,
    // 对Babel解析器的包装使其与 ESLint 兼容。
    parser: 'babel-eslint',
    parserOptions: {
        // 代码是 ECMAScript 模块
        sourceType: 'module'
    },
    env: {
        // 预定义的全局变量，这里是浏览器环境
        browser: true,
    },
    // 扩展一个流行的风格指南，即 eslint-config-standard
    // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
    extends: 'standard',
    // required to lint *.vue files
    plugins: [
        // 此插件用来识别.html 和 .vue文件中的js代码
        'html',
        // standard风格的依赖包
        "standard",
        // standard风格的依赖包
        "promise"
    ],
    //配置的一些规则
    'rules': {
     /*        "indent": ["error",2]
        数组第一个指定是否启用这个规则
            "off" 或 0 - 关闭规则
            "warn" 或 1 - 开启规则，使用警告级别的错误：warn (不会导致程序退出)
            "error" 或 2 - 开启规则，使用错误级别的错误：error (当被触发的时候，程序会退出)

        数组第二个指定空几个空格
    */     
    "indent": ["error",2],
    // allow paren-less arrow functions
    'arrow-parens': 0,
    // allow async-await
    'generator-star-spacing': 0,
    // allow debugger during development
    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
    }
}

其中extends为基础规则

使用 “extends”: “eslint:recommended” 为官方推荐，亦可以使用Airbnb编码规则，操作如下：

https://www.jianshu.com/p/857a840cc9c6

.eslintrc.js 文件详细规则

官方文档：https://eslint.bootcss.com/docs/rules/

module.exports = {
    // 默认情况下，ESLint会在所有父级组件中寻找配置文件，一直到根目录。ESLint一旦发现配置文件中有   "root": true，它就会停止在父级目录中寻找。
    root: true,
    // 对Babel解析器的包装使其与 ESLint 兼容。
    parser: 'babel-eslint',
    parserOptions: {
        // 代码是 ECMAScript 模块
        sourceType: 'module'
    },
    env: {
        // 预定义的全局变量，这里是浏览器环境
        browser: true,
    },
    // 扩展一个流行的风格指南，即 eslint-config-standard
    // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
    extends: 'standard',
    // required to lint *.vue files
    plugins: [
        // 此插件用来识别.html 和 .vue文件中的js代码
        'html',
        // standard风格的依赖包
        "standard",
        // standard风格的依赖包
        "promise"
    ],
    //配置的一些规则
    'rules': {
     /*        "indent": ["error",2]
        数组第一个指定是否启用这个规则
            "off" 或 0 - 关闭规则
            "warn" 或 1 - 开启规则，使用警告级别的错误：warn (不会导致程序退出)
            "error" 或 2 - 开启规则，使用错误级别的错误：error (当被触发的时候，程序会退出)

        数组第二个指定空几个空格
    */     
    "indent": ["error",2],
    // allow paren-less arrow functions
    'arrow-parens': 0,
    // allow async-await
    'generator-star-spacing': 0,
    // allow debugger during development
    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
    }
}

有想换工作的同学可以找我内推哦不低于15k（前端，java，测试）