为什么(以及如何使用FIx)ESLint导入/无外来依赖性安装包上的失败？

Question

当我运行ESLint时,我收到以下错误:

1:13  error  'joi' should be listed in the project's dependencies. Run 'npm i -S joi' to add it        import/no-extraneous-dependencies
2:16  error  'lodash' should be listed in the project's dependencies. Run 'npm i -S lodash' to add it  import/no-extraneous-dependencies

但是,我安装了这两个模块并在我的package.json:

"joi": "^10.4.2",
// Some other packages
"lodash": "^4.17.2",

和运行:

npm i -S joi

没有帮助或解决问题.我也有很多其他包package.json,只有这两个包有问题.这可能是一个错误,但ESLint有很多眼睛,我认为我更有可能做错了什么...只是我无法弄清楚是什么(这些包看起来和其他任何一个一样我的package.json).

任何人都可以建议我(无意中)做出关于这两个软件包的ESLint投诉,只有那两个软件包,尽管它们被安装了吗？

编辑

这是我的package.json(删除了一些不相关的标识位):

{
  "name": "foo",
  "version": "1.0.0",
  "engines": {
    "node": "6.9.4"
  },
  "scripts": {
    "some": "scripts",
  },
  "ava": {
    "babel": "inherit",
    "require": "babel-register",
    "serial": true,
    "verbose": true
  },
  "devDependencies": {
    "@3846masa/axios-cookiejar-support": "0.0.4",
    "apidoc": "^0.17.5",
    "ava": "^0.17.0",
    "babel-eslint": "^7.1.1",
    "babel-plugin-module-alias": "^1.6.0",
    "babel-react-render-defender": "^1.1.1",
    "chai": "^3.5.0",
    "chai-enzyme": "^0.6.1",
    "del": "^2.2.2",
    "enzyme": "^2.6.0",
    "eslint": "^3.19.0",
    "eslint-config-airbnb": "^13.0.0",
    "eslint-import-resolver-babel-module": "^3.0.0",
    "eslint-plugin-babel": "^4.0.0",
    "eslint-plugin-import": "^2.2.0",
    "eslint-plugin-jsx-a11y": "^2.2.3",
    "eslint-plugin-react": "^6.8.0",
    "jsdom": "^9.9.1",
    "nodemon": "^1.11.0",
    "proxyquire": "^1.7.10",
    "react-addons-test-utils": "^15.4.1",
    "react-hot-loader": "^3.0.0-beta.6",
    "really-need": "^1.9.2",
    "redux-devtools-extension": "^1.0.0",
    "s3rver": "^1.0.2",
    "sinon": "^1.17.6",
    "style-loader": "^0.13.1",
    "supertest": "^2.0.1"
  },
  "dependencies": {
    "autoprefixer": "^6.5.4",
    "ava": "^0.17.0",
    "aws-sdk": "^2.7.21",
    "axios": "^0.15.3",
    "babel-core": "^6.20.0",
    "babel-loader": "^6.2.9",
    "babel-plugin-lodash": "^3.2.11",
    "babel-plugin-module-resolver": "^2.5.0",
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-plugin-transform-object-rest-spread": "^6.22.0",
    "babel-plugin-transform-runtime": "^6.15.0",
    "babel-preset-decorators-legacy": "^1.0.0",
    "babel-preset-es2015": "^6.18.0",
    "babel-preset-react": "^6.16.0",
    "babel-runtime": "^6.20.0",
    "bluebird": "^3.4.6",
    "body-parser": "^1.17.1",
    "celebrate": "^4.0.0",
    "chai-diff": "^1.0.1",
    "classnames": "^2.2.5",
    "clipboard": "^1.6.1",
    "compression": "^1.6.2",
    "cookie-parser": "^1.4.3",
    "cookie-session": "^2.0.0-alpha.2",
    "core-decorators": "^0.15.0",
    "csrf": "^3.0.6",
    "css-mqpacker": "^5.0.1",
    "cssnano": "^3.9.1",
    "debug": "^2.6.0",
    "dotenv": "^2.0.0",
    "express": "^4.14.0",
    "express-sanitizer": "^1.0.2",
    "extract-text-webpack-plugin": "^1.0.1",
    "faker": "^3.1.0",
    "feedparser": "^2.0.0",
    "file-loader": "^0.10.0",
    "flatpickr": "^2.6.1",
    "helmet": "^3.5.0",
    "html-webpack-plugin": "^2.28.0",
    "immutability-helper": "^2.1.1",
    "joi": "^10.4.1",
    "js-cookie": "^2.1.3",
    "json-loader": "^0.5.4",
    "jsonp-promise": "^0.1.2",
    "knex": "0.12.9",
    "libxmljs": "^0.18.4",
    "lodash": "^4.17.2",
    "lodash-webpack-plugin": "^0.11.0",
    "moment": "^2.18.1",
    "morgan": "^1.7.0",
    "node-fetch": "^1.6.3",
    "pg": "^6.1.2",
    "plist": "^2.0.1",
    "postcss": "^5.2.6",
    "postcss-custom-media": "^5.0.1",
    "postcss-custom-properties": "^5.0.1",
    "postcss-import": "^9.0.0",
    "postcss-loader": "^1.2.1",
    "raw-loader": "^0.5.1",
    "rc-time-picker": "^2.3.3",
    "react": "^15.4.1",
    "react-addons-shallow-compare": "^15.4.2",
    "react-dnd": "^2.2.3",
    "react-dnd-html5-backend": "^2.2.3",
    "react-dom": "^15.4.1",
    "react-flatpickr": "^3.3.0",
    "react-json-tree": "^0.10.1",
    "react-modal": "^1.6.5",
    "react-redux": "^5.0.0",
    "react-router": "^3.0.0",
    "react-router-redux": "^4.0.7",
    "react-sortable-hoc": "^0.6.1",
    "react-virtualized": "^8.11.4",
    "recompose": "^0.23.1",
    "redux": "^3.6.0",
    "redux-actions": "^1.2.0",
    "redux-debounce": "^1.0.1",
    "redux-logger": "^2.7.4",
    "redux-promise": "^0.5.3",
    "redux-thunk": "^2.1.0",
    "reselect": "^2.5.4",
    "stylelint": "^7.7.0",
    "svg-react-loader": "^0.4.0-beta.2",
    "svgo": "^0.7.1",
    "to-exports": "^0.1.0",
    "twit": "^2.2.5",
    "url-loader": "^0.5.7",,
    "webpack": "^1.14.0",
    "webpack-dev-middleware": "^1.8.4",
    "webpack-hot-middleware": "^2.15.0",
    "webpack-split-chunks": "^0.1.1",
    "xmlbuilder": "^8.2.2"
  }
}

你可以看到它很简单; 只是很多包.这是我的.eslintrc:

{
  "extends": "airbnb",
  "env": {
    "browser": true,
    "node": true
  },
  "globals": {
    "NODE_ENV": true,
    "isProduction": true,
    "__ROUTE__": true
  },
  "parser": "babel-eslint",
  "plugins": [
    "babel"
  ],
  "rules": {
    "react/jsx-filename-extension": [
      "error",
      {
        "extensions": [
          ".js",
          ".jsx"
        ]
      }
    ],
    "comma-dangle": [
      "error",
      {
        "arrays": "always-multiline",
        "objects": "always-multiline",
        "imports": "always-multiline",
        "exports": "always-multiline",
        "functions": "ignore"
      }
    ],
    "eol-last": "error",
    "import/order": "error",
    "This next rule is just temporary until we start using PropTypes": 0,
    "react/prop-types": 0
  },
  "settings": {
    "import/resolver": {
      "babel-module": {}
    }
  }
}

Answer 1

如果您在搜索“未找到规则‘导入/无无关依赖项’的定义”时到达此处

然后要解决此问题，您应该"plugins": ["import"]在.eslintrc文件中添加

Answer 2

devDependencies: packageDir或devDependencies: false上述解决方案对我不起作用，但最终我解决了这个问题。以下是对我有用的内容：

"import/no-extraneous-dependencies": [
  "error",
  {
    "devDependencies": ["test/**"],
    "optionalDependencies": false,
    "peerDependencies": false
  }
],

只需列出您的测试文件夹devDependencies而不是false.

Answer 3

我只是通过将 devDependencies 设置为 true 来解决它。默认情况下它是假的。

"import/no-extraneous-dependencies": [
        "error", {
           "devDependencies": true
        }
    ]

Answer 4

我通过简单地删除该node_modules文件夹然后package-lock.json执行一个新的操作来解决这个问题npm install

Answer 5

将以下内容添加到您的夹心中，只是为了在其中包含正确的规则。是的，您也可以将其关闭，但是由于e原因，该错误在那里。

"import/no-extraneous-dependencies": ["error", {"devDependencies": false, "optionalDependencies": false, "peerDependencies": false}]

据我所知，您的package.json没有问题，因此它必须是语法问题。

我没有您的代码，因此我将显示示例：

var _ = require('lodash');
import _ from 'lodash';

如果您具有上述代码（或类似的代码）

然后将其更改为：

import test from 'ava';
import find from 'lodash.find';

你可以在这里阅读更多：

https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/no-extraneous-dependencies.md

Answer 6

我有同样的问题。

为我解决的是显式添加packageDir选项：

"import/no-extraneous-dependencies": [
    "error", {
       "devDependencies": false, 
       "optionalDependencies": false, 
       "peerDependencies": false, 
       "packageDir": "./"
    }
]

Answer 7

我做了什么来解决这个问题：

"import/no-extraneous-dependencies": [
  "error",
  {
    "devDependencies": [
      "**/*.stories.*",
      "**/.storybook/**/*.*",
      "**/*.test.*"
    ],
    "peerDependencies": true
  }
]

Answer 8

对我来说，我最终发现，当我在控制台中运行时， linter 错误并没有yarn lint发生，只是 VSCode 错误地用此错误突出显示了我的 import 语句。关闭项目并在 VSCode 中重新打开解决了该问题。

Answer 9

到目前为止，我遇到过类似的问题，并且以与这里其他人不同的方式解决这些问题。我正在使用 TypeScript，虽然我的设置适用于大多数包，但有时会有一个包抛出该import/no-extraneous-dependencies错误。

我的 .eslintrc 的关键部分：

  "settings": {
    "import/resolver": {
      "typescript": {}
    },
    "import/core-modules": ["dayjs"]
  }

Dayjs 是给我带来此错误的模块之一，但您可以将任何给您带来错误的模块添加到 core-modules 数组中，它可以解决问题。