VSCode中使用eslint插件配合该规则报错

[xiaotan0305]

vscode中配置configFile,然后全局安装依赖模块

cnpm i eslint typescript @typescript-eslint/parser @typescript-eslint/eslint-plugin eslint-config-alloy -g

vscode配置文件如下：

"eslint.autoFixOnSave": true,
    "eslint.options": {
        "fix": true,
        "extensions": [
            ".js",
            ".ts",
            ".vue",
            ".html"
        ],
        "configFile": "/Users/tan/WebSite/eslint/eslintrc.public.js"
    },
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "typescript",
            "autoFix": true
        },
        {
            "language": "html",
            "autoFix": true
        },
        {
            "language": "vue",
            "autoFix": true
        }
    ],

文件eslintrc.public.js配置如下：

module.exports = {
    extends: [
        'alloy',
        'alloy/typescript',
    ],
    env: {
        // 这里填入你的项目用到的环境
        // 它们预定义了不同环境的全局变量，比如：
        //
        es6: true,
        browser: true,
        node: true,
        amd: true,
        jquery: true
    },
    globals: {
        // 这里填入你的项目需要的全局变量
        // false 表示这个全局变量不允许被重新赋值，比如：
        seajs: true,
        wx: true,
        App: true,
        getApp: true,
        Page: true,
        getCurrentPages: true,
        Vue: true,
        fangimjs: true,
        THREE: true,
        layui: true,
        PIXI: true
    },
    rules: {
        // 这里填入你的项目需要的个性化配置
    }
};

报错信息如下：

[Info  - 7:21:42 PM] ESLint server stopped.
[Info  - 7:21:42 PM] ESLint server running in node v10.11.0
[Info  - 7:21:42 PM] ESLint server is running.
[Info  - 7:21:43 PM] ESLint library loaded from: /usr/local/lib/node_modules/eslint/lib/api.js
[Error - 7:21:43 PM] ESLint stack trace:
[Error - 7:21:43 PM] Error: Failed to load config "alloy" to extend from.
Referenced from: /Users/tan/WebSite/eslint/eslintrc.public.js
    at configMissingError (/usr/local/lib/node_modules/eslint/lib/cli-engine/config-array-factory.js:233:9)
    at ConfigArrayFactory._loadExtendedShareableConfig (/usr/local/lib/node_modules/eslint/lib/cli-engine/config-array-factory.js:712:23)
    at ConfigArrayFactory._loadExtends (/usr/local/lib/node_modules/eslint/lib/cli-engine/config-array-factory.js:617:25)
    at ConfigArrayFactory._normalizeObjectConfigDataBody (/usr/local/lib/node_modules/eslint/lib/cli-engine/config-array-factory.js:547:25)
    at _normalizeObjectConfigDataBody.next (<anonymous>)
    at ConfigArrayFactory._normalizeObjectConfigData (/usr/local/lib/node_modules/eslint/lib/cli-engine/config-array-factory.js:491:20)
    at _normalizeObjectConfigData.next (<anonymous>)
    at createConfigArray (/usr/local/lib/node_modules/eslint/lib/cli-engine/config-array-factory.js:307:25)
    at ConfigArrayFactory.loadFile (/usr/local/lib/node_modules/eslint/lib/cli-engine/config-array-factory.js:382:16)
    at createCLIConfigArray (/usr/local/lib/node_modules/eslint/lib/cli-engine/cascading-config-array-factory.js:140:35)

如果将依赖模块安装在配置的规则文件所在目录时(/Users/tan/WebSite/eslint/)报错如下

[Info  - 7:25:41 PM] ESLint server stopped.
[Info  - 7:25:42 PM] ESLint server running in node v10.11.0
[Info  - 7:25:42 PM] ESLint server is running.
[Info  - 7:25:43 PM] ESLint library loaded from: /usr/local/lib/node_modules/eslint/lib/api.js
[Error - 7:25:45 PM] 
Failed to load plugin '@typescript-eslint' declared in '--config » eslint-config-alloy/typescript': Cannot find module '@typescript-eslint/eslint-plugin'
Require stack:
- /Users/tan/WebSite/node-base/__placeholder__.js
Happened while validating /Users/tan/WebSite/node-base/app/extend/helper/util.ts
This can happen for a couple of reasons:
1. The plugin name is spelled incorrectly in an ESLint configuration file (e.g. .eslintrc).
2. If ESLint is installed globally, then make sure '@typescript-eslint/eslint-plugin' is installed globally as well.
3. If ESLint is installed locally, then '@typescript-eslint/eslint-plugin' isn't installed correctly.

Consider running eslint --debug /Users/tan/WebSite/node-base/app/extend/helper/util.ts from a terminal to obtain a trace about the configuration files used.

[xiaotan0305]

将依赖模块安装在项目内没有问题。 我们的使用场景是： 统一配置文件和全局安装依赖模块，当打开所有项目均可以使用esint，不想每个项目安装一次

[xiaotan0305]

使用debug 查看eslint命令行模式

DEBUG='eslint:config-array-factory' eslint /Users/tan/WebSite/node-base/app/extend/helper/util.ts  --config=/Users/tan/WebSite/eslint/eslintrc.public.js

报错信息如下：

eslint:config-array-factory Loading JS config file: /Users/tan/WebSite/eslint/eslintrc.public.js +0ms
  eslint:config-array-factory Loading {extends:"alloy"} relative to /Users/tan/WebSite/eslint/eslintrc.public.js +14ms

Oops! Something went wrong! :(

ESLint: 6.4.0.

ESLint couldn't find the config "alloy" to extend from. Please check that the name of the config is correct.

The config "alloy" was referenced from the config file in "/Users/tan/WebSite/eslint/eslintrc.public.js".

If you still have problems, please stop by https://gitter.im/eslint/eslint to chat with the team.

[xiaotan0305]

找到问题了，ESlint 6.* 的即使全局安装eslint，对应的插件也需要在每个项目里单独安装 参考链接： https://eslint.org/docs/user-guide/migrating-to-6.0.0#package-loading-simplification 配置说明： https://eslint.org/docs/developer-guide/nodejs-api#cliengine 解决办法： vscode 中eslint插件增加配置项resolvePluginsRelativeTo

"eslint.options": {
        "configFile": "/Users/tan/WebSite/eslint/eslintrc.public.js",
        "resolvePluginsRelativeTo": "/Users/tan/WebSite/eslint"
    },

[lqzhgood]

按照LZ 设置了 resolvePluginsRelativeTo 还是出现同样的问题。。。 直接使用 lz 的 eslint config 也一样。。。 无语了……

全局安装

extends:{
        "plugin:vue/essential",
        "plugin:react/recommended",
        "plugin:@typescript-eslint/recommended"
}

这几条又能正常使用。。。

[xcatliu]

@lqzhgood 报错信息是什么？

[lqzhgood]

vscode eslint 相关

    "eslint.alwaysShowStatus": true,
    "eslint.options": {
        "configFile": "D:/My/Config/DEV/editor/eslintrc.public.js",
        "resolvePluginsRelativeTo": "D:\\My_local\\Config\\nodejs\\npm",
    },
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        "html",
        "vue",
        "vue-html",
        // "typescript",
        // "typescriptreact",
    ],
    // "eslint.autoFixOnSave": true,
    "editor.codeActionsOnSave": {
        "source.fixAll.eslint": true,
        "source.fixAll.tslint": true
    },

全局 eslint 配置文件

module.exports = {
    extends: [
        'alloy',
       // 'alloy/typescript',
    ],
    env: {
        // 这里填入你的项目用到的环境
        // 它们预定义了不同环境的全局变量，比如：
        //
        es6: true,
        browser: true,
        node: true,
        amd: true,
        jquery: true
    },
    globals: {
        // 这里填入你的项目需要的全局变量
        // false 表示这个全局变量不允许被重新赋值，比如：
        seajs: true,
        wx: true,
        App: true,
        getApp: true,
        Page: true,
        getCurrentPages: true,
        Vue: true,
        fangimjs: true,
        THREE: true,
        layui: true,
        PIXI: true
    },
    rules: {
        // 这里填入你的项目需要的个性化配置
    }
};

报错信息

[Error - 下午7:56:51] Error: Failed to load config "alloy" to extend from.
Referenced from: D:\My\Config\DEV\editor\eslintrc.public.js
    at configMissingError (D:\My_local\Config\nodejs\npm\node_modules\eslint\lib\cli-engine\config-array-factory.js:265:9)
    at ConfigArrayFactory._loadExtendedShareableConfig (D:\My_local\Config\nodejs\npm\node_modules\eslint\lib\cli-engine\config-array-factory.js:826:23)
    at ConfigArrayFactory._loadExtends (D:\My_local\Config\nodejs\npm\node_modules\eslint\lib\cli-engine\config-array-factory.js:731:25)
    at ConfigArrayFactory._normalizeObjectConfigDataBody (D:\My_local\Config\nodejs\npm\node_modules\eslint\lib\cli-engine\config-array-factory.js:660:25)
    at _normalizeObjectConfigDataBody.next (<anonymous>)
    at ConfigArrayFactory._normalizeObjectConfigData (D:\My_local\Config\nodejs\npm\node_modules\eslint\lib\cli-engine\config-array-factory.js:596:20)
    at _normalizeObjectConfigData.next (<anonymous>)
    at createConfigArray (D:\My_local\Config\nodejs\npm\node_modules\eslint\lib\cli-engine\config-array-factory.js:340:25)
    at ConfigArrayFactory.loadFile (D:\My_local\Config\nodejs\npm\node_modules\eslint\lib\cli-engine\config-array-factory.js:415:16)
    at createCLIConfigArray (D:\My_local\Config\nodejs\npm\node_modules\eslint\lib\cli-engine\cascading-config-array-factory.js:157:35)

全局 npm 安装的包

+-- @typescript-eslint/eslint-plugin@2.24.0
+-- @typescript-eslint/parser@2.24.0
+-- @vue/cli@4.2.3
+-- babel-eslint@10.1.0
+-- browser-sync@2.26.7
+-- create-react-app@3.4.0
+-- devtool@2.3.1
+-- eslint@6.8.0
+-- eslint-config-alloy@3.6.0
+-- eslint-plugin-html@6.0.0
+-- eslint-plugin-react@7.19.0
+-- eslint-plugin-react-hooks@2.5.0
+-- eslint-plugin-vue@6.2.2
+-- express-generator@4.16.1
+-- git-cz@4.3.1
+-- gulp-cli@2.2.0
+-- hexo-cli@3.1.0
+-- http-server@0.12.1
+-- nexe@3.3.2
+-- nodemon@2.0.2
+-- npm@6.14.2
+-- npm-check-updates@4.0.4
+-- parcel-bundler@1.12.4
+-- parcel-plugin-change-file@1.3.0
+-- pkg@4.4.4
+-- sass@1.26.3
+-- spy-debugger@3.8.5
+-- typescript@3.8.3
`-- yarn@1.22.4

[xcatliu]

请升级 eslint-config-alloy 以及相关包到最新版试试。

[cookcc]

请升级 eslint-config-alloy 以及相关包到最新版试试。

升级了不管用，我的使用是自己创建了一个eslint-config项目，然后这个项目中的eslintrc配置文件中使用alloy的typescript react方案安装对应的几个依赖，然后在自己的开发项目中引入自己创建 的eslint-config项目，报错如图所示

[cookcc]

请升级 eslint-config-alloy 以及相关包到最新版试试。

相当于说你的主项目依赖了自定义的eslint-config-custom规则，而eslint-config-custom项目依赖了alloy，当我在主项目中安装eslint-config-custom时，并不会将eslint-config-custom中的依赖alloy一并安装下来，尽管你在eslint-config-custom中的package.json里声明了peerDependencies: { "alloy": ">=4.2.0" }，因为在高版本的npm 中不会自动在主项目中把依赖的插件里的依赖也一并安装，只会有一个warn 的提示，让你在当前的主项目中安装alloy，对于这种问题有什么好的解决方案么？

[cookcc]

目前的解决方案： 将eslint-config-custom中需要在主项目上安装的依赖从devDependencies换成dependencies可解决问题，也就不存在上面的问题

[xcatliu]

对，换成 dependencies 应该就可以了