目录

• vscode的eslint插件不起作用
• vscode eslint配置
• 总结

vscode的eslint插件不起作用

某次对vue项目重构之后,关闭项目再打开,突然发现prettier好使,但是eslint不好用了。

通过尝试网上的各种方法,最终找到解决方案。

• VS Code打开“设置”,在扩展(extensions)中选择eslint,并打开"settings.json"
• 输入(文件中有重复属性使用一次即可):

"eslint.validate": [
    "javascript",
    "javascriptreact",
    {
      "language": "vue",
      "autoFix": true
    },
    "vue"
  ],
  "eslint.autoFixOnSave": true

• 之后重启一下vsCode,eslint的检查就生效了。

vscode eslint配置

正常eslint配置百度一大堆

现在新版本只需要安装eslint插件之后在settting里面配置

 //* 保存时使用eslint自动修正
 "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },

就可以了。

我的问题:

我有两个umi项目,但是一个项目对debugger保留字校验,一个不校验?

两个项目下面都有.eslintrc.js

module.exports = {
  extends: [require.resolve('@umijs/fabric/dist/eslint')],
  globals: {
    ANT_DESIGN_PRO_ONLY_DO_NOT_USE_IN_YOUR_PRODUCTION: true,
    page: true,
    REACT_APP_ENV: true,
  },
};

找到对应@umijs/fabric发现两个项目版本不一致,从而导致eslint配置不一致。

那我怎么让我的项目可以检测debugger呢?

修改.eslintrc.js

module.exports = {
    extends: [require.resolve('@umijs/fabric/dist/eslint')],
    globals: {
        ANT_DESIGN_PRO_ONLY_DO_NOT_USE_IN_YOUR_PRODUCTION: true,
        page: true,
        REACT_APP_ENV: true,
    },
    rules: {
        'no-debugger': 'error',
    },
};

就可以了。

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持代码部落。