Vue ESLint

作用

1. 审查代码是否符合编码规范和统一代码风格
2. 审查代码是否存在语法错误

配置

• .editorconfig

.editorconfig用于配置IDE工具，EditorConfig插件会去查找当前编辑文件所在目录及其上级目录是否存在.editorconfig文件，若存在IDE的行为会与.editorconfig文件中定义的保持一致，且优先级高于编辑器自身的设置。

# .editorconfig
root = true
# 配置对所有文件有效
[*]
# 设置编码格式
charset = utf-8
# 设置缩进类型，可选space和tab。
indent_style = space
# 设置缩进数量，可选值为2、4或tab
indent_size = 2
# 设置换行符格式
end_of_line = lf
# 设置是否在文件最后插入一个空行
insert_final_newline = true
# 设置是否删除行尾的空格
trim_trailing_whitespace = true

• .eslintignore.js

.eslintignore.js文件用于设置需要ESLint忽略的文件，仅对JS文件有效。

/build/
/config/
/dist/
/*.js
/test/unit/coverage/

• .eslintrc.js

.eslintrc.js用于配置ESLint的检查规则

module.exports = {
  //设置当前文件是否为ESLint的根
  root: true,
  //指定ESLint解析器选项
  parserOptions: {
    //babel-eslint解析器是对babel解析器的包装，使其与ESLint解析。
    parser: 'babel-eslint'
  },
  //指定环境的全局变量
  env: {
    //指定为浏览器环境
    browser: true,
  },
  //配置标准JS风格规范
  extends: [
    //提供规范的插件
    'plugin:vue/essential', 
    'standard'
  ],
  // required to lint *.vue files
  plugins: [
    'vue'
  ],
  // 自定义规范
  rules: {
    // allow async-await
    'generator-star-spacing': 'off',
    // allow debugger during development
    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
  }
}