VSCode 如何使用 eslint

第一步，打开VSCdoe，在拓展中搜索eslint插件，并安装。

第二步，在工作区文件夹中安装eslint  npm install eslint 或者 全局安装 npm install -g eslint。

 第三步，在所在工作区的根目录下创建. eslintrc.json 文件， 或者 在终端使用npx-ESLint-init运行ESLint命令。

 第四步，在VSCode配置eslint设置选项

{
    // 默认onType类型
    "eslint.run": "onType",
    // 这个设置代表哪些文件允许ESLint规则
    "eslint.options": {
        "extensions": [
            ".js",
            ".vue",
            ".jsx",
            ".tsx"
        ]
    },
    // 这个设置允许你在保存文件时自动修复所有可用的 ESLint 规则问题
    "editor.codeActionsOnSave": {
        "source.fixAll.eslint": "explicit"
    },
}

更多设置项可在扩展中点击eslint查看

以下是.eslintrc.json 个人配置分享

{
  "env": {
    "browser": true,
    "commonjs": true,
    "es6": true,
    "node": true
  },
  "extends": [
    "plugin:vue/recommended",
    // "standard-with-typescript",
    "eslint:recommended"
  ],
  "overrides": [
  ],
  "parserOptions": {
    "ecmaVersion": "latest",
    "sourceType": "module"
  },
  "globals": {
    "globalConfig": "readonly",
    "$i18nConfig": "readonly",
    "$extend": "readonly",
    "moment": "readonly",
    "AMap":"readonly"
  },
  "rules": {
    "indent":[2,4,{ "SwitchCase": 1 }],//强制使用一致的缩进
    "key-spacing": [2,{"beforeColon": false,"afterColon": true}],// 强制在对象字面量的属性中键和值之间使用一致的间距
    "space-before-function-paren": [2, "always"], // 强制在函数名和左括号之间添加一个空格
    "space-before-blocks": [1, "always"],	// 强制在控制语句（如 if, for, while 等）的左花括号前添加一个空格						
    "no-extra-parens": 1,// 禁止不必要的括号
    "comma-spacing": ["error", { "before": false, "after": true }],
    "space-infix-ops": ["error", {"int32Hint": false}],// 
    "no-extra-semi": 2,	// 禁止不必要的分号
    "no-useless-escape": 1,	// 禁止不必要的转义字符
    "quotes": 1, 	// 强制使用一致的反勾号、双引号或单引号
    "semi-spacing": 0,	// 分号后面和前面是否应该有空格
    "object-curly-spacing": 0,	// 强制在花括号中使用一致的空格
    "no-var": 0,//要求使用 let 或 const 而不是 var
    "strict": 0,//是否禁止严格模式
    "prefer-const": 0,//要求使用 const 声明那些声明后不再被修改的变量
    "camelcase": 0,//强制使用骆驼拼写法命名约定
    "func-names": 0,//要求或禁止使用命名的 function 表达式
    "no-console": 0,//禁用 console
    "no-redeclare": 0,//禁止重新声明变量
    "no-sparse-arrays":2,//禁用稀疏数组
    "valid-jsdoc":0,// 强制使用有效的 JSDoc 注释
    "eqeqeq":2,//要求使用 === 和 !==
    "no-fallthrough":2,//禁止 case 语句落空
    "no-unused-vars":1,//禁止出现未使用过的变量
    "no-use-before-define":0, //禁止在变量定义之前使用它们.
    "no-tabs":0, //禁用 tab
    "arrow-body-style":1,//要求箭头函数体使用大括号
    "arrow-parens":1,//要求箭头函数的参数使用圆括号
    "no-const-assign":2,//禁止修改 const 声明的变量
    "no-duplicate-imports":2,//禁止重复模块导入
    "no-underscore-dangle":0, //禁止标识符中有悬空下划线
    "guard-for-in":0, //需要约束 for-in
    "no-restricted-syntax":0, //禁止使用特定的语法
    "no-continue":0, //禁用 continue 语句
    "max-len":0, //强制行的最大长度
    "no-plusplus":0, //禁止使用一元操作符 ++ 和 --
    "no-param-reassign":0, //禁止对函数参数再赋值
    "class-methods-use-this":0, //强制类方法使用 this
    "no-unused-expressions":1, //禁止未使用过的表达式
    "no-bitwise":0, //禁止使用按位操作符
    "prefer-destructuring":0, //优先使用数组和对象解构
    "new-cap":0, //要求构造函数首字母大写
    "no-multi-assign":0, //禁止连续赋值
    "radix":0, //强制在parseInt()使用基数参数
    "import/order":0, //import顺序有误
    "import/no-extraneous-dependencies": 0, //禁止用外部依赖
    "no-shadow":1, //禁止变量声明与外层作用域的变量同名
    "no-restricted-properties": 0, //禁止使用对象的某些属性
    "linebreak-style":0, //强制一直的换行风格
    "no-lonely-if":0, //禁止 if 作为唯一的语句出现在 else 语句中
    "one-var":0, //强制函数中的变量要么一起声明要么分开声明
    "one-var-declaration-per-line":0, //要求或禁止在变量声明周围换行
    "global-require":0, //禁止模块内部使用require增加开销
    "no-mixed-operators":0, //禁止混合使用不同的操作符
    "no-nested-ternary":0 //禁用嵌套的三元表达式
  }
}