Quick Fix: In the .eslintrc
file, update the import/no-extraneous-dependencies
rule with the devDependencies: true
option to exclude test dependencies from dependency checks.
The Problem:
The ESLint plugin import/no-extraneous-dependencies is flagging test dependencies as extraneous, even though they are correctly listed in the project’s devDependencies
. This is causing confusion and potentially leading to incorrect project configurations. Why is ESLint identifying test dependencies as extraneous when they are properly specified in devDependencies
?
The Solutions:
Solution 1: Adding Exceptions Through .eslintrc File
To resolve the issue where ESLint is reporting that certain test dependencies should be listed in the project’s `dependencies` instead of `devDependencies`, you can add the following line to your `.eslintrc` file:
"import/no-extraneous-dependencies": ["error", {"devDependencies": true}]
This will configure ESLint to ignore dependencies that are specified in the `devDependencies` section of your `package.json` file.
This solution allows you to keep the test dependencies in the `devDependencies` section, while still receiving warnings for any other dependencies that are not properly specified.
Solution 4: Fix eslint error by adding missing packages to plugins
To fix the error, you need to add the missing packages to your plugins
directory in .eslintrc
.
For example, if the missing packages are Typescript and Storybook, you would add the following to your .eslintrc
file:
{
"plugins": [
"typescript",
"storybook"
]
}
After adding the missing packages to your plugins
directory, the error should disappear.
For more information on how to fix this error, please refer to the following Stack Overflow post: https://stackoverflow.com/questions/70585870/eslint-error-storybook-react-should-be-listed-in-the-projects-dependencies/70585871#70585871.
Solution 5: Disable the Rule
If you are certain that the rule is incorrect in your specific case, you can disable it by adding the following to your .eslintrc
file:
"import/no-extraneous-dependencies": "off"
This will turn off the rule for your entire project.