eslint不处理多个package.json

Question

My project have two package.json

root folder

└ app ---- /public
         └ /styles
         └ /src
         └ package.json
         └ eslintrc.json
         └ webpack.config.js

└ server - /something
         └ /something

└ package.json
└ ...etc

atom editor shows lint error

import React from 'react';
// 'react' should be listed in the project's dependencies. Run 'npm i -S react' to add it (import/no-extraneous-dependencies)

In package.json

"dependencies": {
  "@types/chart.js": "^2.6.8",
  "@types/react": "^16.0.10",
  "@types/react-dom": "^16.0.1",
  "bootstrap": "^4.0.0-beta",
  "chart.js": "2.6.0",
  "font-awesome": "^4.7.0",
  "history": "4.7.2",
  "jwt-decode": "^2.2.0",
  "prop-types": "^15.6.0",
  "react": "^15.6.1",
  "react-chartjs-2": "2.6.1",
  "react-dom": "^15.6.1",
  "react-router-dom": "4.2.2",
  "react-transition-group": "^1.2.0",
  "reactstrap": "^4.8.0",
  "simple-line-icons": "^2.4.1"
},

and in eslintrc.json

module.exports = {
  "extends": "airbnb",

  "env": {
     "browser": true,
     "node": true
   },

  "rules": {
     "no-mixed-operators": [2, { "allowSamePrecedence": true }],
     "react/no-find-dom-node": 1,
     "react/no-string-refs": 1,
     "react/no-unused-prop-types": 1, // TODO: enable
     "jsx-a11y/no-static-element-interactions": 1, // TODO: enable
     "no-plusplus": 1, // TODO: enable
     "no-console": 0, // TODO: enable
     "no-alert": 0,
     "max-len": ["error", 120],
     "no-underscore-dangle": ["error", { "allow": ["_isMounted"] }],
     "import/no-extraneous-dependencies": ["error", {"devDependencies": true}],
  },
};

I think that eslint recognize package.json in root folder as standard. But I want that it ignores package.json in root folder and recognize package.json in src folder.

How can I do?

Answer 1

This may be unrelated, but the first item I'd note is that you might need to rename your ESLint configuration from eslintrc.json to .eslintrc.json (with a dot before the name). May not be the source of the trouble, but could possibly be interfering with the hierarchical resolution. You can look into the multiple configuration extension formats here: https://eslint.org/docs/user-guide/configuring#configuration-file-formats .

Regarding the import/no-extraneous-dependencies rule specifically, I think the configuration option you might be looking for is packageDir . Quoting the docs in their repo:

Also there is one more option called packageDir , this option is to specify the path to the folder containing package.json and is relative to the current working directory.

"import/no-extraneous-dependencies": ["error", {"packageDir": './some-dir/'}]

Hope this helps!

Source:

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

Answer 2

I solved this problem myself.

Added "packageDir": "./src" in .eslintrc.json

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