• eslint的使用和配置


                eslint的使用和配置

      什么是eslint

        ESLint 是在 ECMAScript/JavaScript 代码中识别和报告模式匹配的工具,它的目标是保证代码的一致性和避免错误。在许多方面,它和 JSLint、JSHint 相似,除了少数的例外:   

        1. ESLint 使用 Espree 解析 JavaScript。

        2. ESLint 使用 AST 去分析代码中的模式

        3. ESLint 是完全插件化的。每一个规则都是一个插件并且你可以在运行时添加更多的规则。

      使用方式

        Configuration Comments - 使用 JavaScript 注释把配置信息直接嵌入到一个文件。

        Configuration Files - 使用 JavaScript、JSON 或者 YAML 文件为整个目录和它的子目录指定配置信息。可以用 .eslintrc.* 文件或者在 package.json文件里的 eslintConfig 字段这两种方式进行配置,ESLint 会查找和自动读取它们,再者,你可以在命令行指定一个配置文件。

      错误级别

        三个错误级别可以允许你细粒度的控制 ESLint 是如何应用规则。①"off" 或者 0 - 关闭规则,②"warn" 或者 1 - 将规则视为一个警告(不会影响退出码),③"error" 或者 2 - 将规则视为一个错误 (退出码为1)。

      使用和总结

        使用framework7 + react + react-redux + webpack 做的手机APP,eslint的配置如下:

     1 {
     2   "parser": "babel-eslint",  //解析器 对Babel解析器的包装使其与 ESLint 兼容
     3   "plugins": [  //适用于特定 ESLint 无法识别的 JSX 语法(插件:eslint-plugin-react)
     4     "react"
     5   ],
     6   "parserOptions": { //想要支持的JavaScript 语言选项
     7     "ecmaVersion": 6,  //es6语法
     8     "sourceType": "module", //设置为 "script" (默认) 或 "module"(如果你的代码是 ECMAScript 模块)。
     9     "ecmaFeatures": { //对象,表示你想使用的额外的语言特性
    10       "jsx": true  //启用 JSX
    11     }
    12   },
    13    //预定义的全局变量
    14   "env": {
    15     "browser": true,
    16     "es6": true,
    17     "node": true
    18   },
    19     //项目中要使用哪些规则
    20   "rules": {
    21     "comma-dangle": 1,  //对象字面量项尾不能有逗号
    22     "quotes": [ 1, "single" ], //引号类型
    23     "no-undef": 1,  //不能有未定义的变量
    24     "global-strict": 0,  //
    25     "no-extra-semi": 1,  //禁止多余的冒号
    26     "no-underscore-dangle": 0,  //标识符不能以_开头或结尾
    27     "no-console": 1, //禁止使用console
    28     "no-unused-vars": 1,  //不能有声明后未被使用的变量或参数
    29     "no-trailing-spaces": [1, { "skipBlankLines": true }], //一行结束后面不要有空格
    30     "no-unreachable": 1,  //不能有无法执行的代码
    31     "no-alert": 0, //禁止使用alert confirm prompt
    32     "react/jsx-uses-react": 1,  //下面两个是使用eslint-plugin-react的要求
    33     "react/jsx-uses-vars": 1
    34   }
    35 }

      如果一个规则有额外的选项,你可以使用数组字面量指定它们,如quotes: ["error", "double"]。配置很多,就不一一列出,可以看下这篇规则说明:Eslint规则说明

      中文官网 

  • 相关阅读:
    远程桌面无法复制粘贴
    tns no listener
    10046 trace and sql
    MySQL replace into 用法(insert into 的增强版)
    USB接口大百科:看完你就分得清充电线了
    世界富人的财富诀窍
    php 23种设计模式的趣味解释
    23种设计模式
    设计模式的分类记忆方法
    项目管理基础:考试必过神之冲刺背诵口诀精简
  • 原文地址:https://www.cnblogs.com/cleaverlove/p/8065334.html
Copyright © 2020-2023  润新知