Reactjs Eslint导入/路径上无无关依赖项错误
我正在使用Eslint设置构建React应用程序。 在我的应用程序中,我使用GraphQL@apollo/客户端依赖关系 当我试图从'@apollo/client/link/context' 我有一个埃斯林错误Reactjs Eslint导入/路径上无无关依赖项错误,reactjs,graphql,eslint,apollo-client,eslintrc,Reactjs,Graphql,Eslint,Apollo Client,Eslintrc,我正在使用Eslint设置构建React应用程序。 在我的应用程序中,我使用GraphQL@apollo/客户端依赖关系 当我试图从'@apollo/client/link/context' 我有一个埃斯林错误 '@apollo/client/link/context' should be listed in the project's dependencies. Run 'npm i -S @apollo/client/link/context' to add it import/no-ex
'@apollo/client/link/context' should be listed in the project's dependencies. Run 'npm i -S @apollo/client/link/context' to add it import/no-extraneous-dependencies
我的package.json中确实存在“@apollo/client”依赖项。
根据阿波罗文档,从“@apollo/client/link/context”导入是获取“setContext”的正确方法
似乎import/no extreaneous dependencies
无法识别来自“@apollo/client”的嵌套路径
当我在我的.eslintrc.js规则中设置“导入/无无关依赖项”:0
时,它将正常工作。
但是对于一个合适的解决方案,我假设我可能需要使用.eslintrc.js规则设置一些东西,而不是仅仅关闭eslint检查
在这种情况下,为了正确解决问题,我应该为我的.eslintrc.js中的规则编写哪些其他设置
my package.json:
{
"name": "my-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"@apollo/client": "^3.3.19",
"@auth0/auth0-react": "^1.4.0",
"@testing-library/jest-dom": "^5.11.4",
"@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10",
"eslint": "^7.26.0",
"eslint-config-airbnb": "^18.2.1",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-react": "^7.23.2",
"eslint-plugin-react-hooks": "^4.2.0",
"graphql": "^15.5.0",
"react": "^17.0.2",
"react-big-calendar": "^0.33.3",
"react-dom": "^17.0.2",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.3",
"web-vitals": "^1.0.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {}
}
和my.eslintrc.js文件:
module.exports = {
env: {
browser: true,
es2021: true,
},
extends: [
'plugin:react/recommended',
'airbnb',
],
parserOptions: {
ecmaFeatures: {
jsx: true,
},
ecmaVersion: 12,
sourceType: 'module',
},
plugins: [
'react',
],
rules: {
'no-console': 1,
'react/prop-types': 0,
'no-underscore-dangle': ['error', { allow: ['__raw'] }],
},
overrides: [
{
files: ['**/*.test.jsx'],
env: { jest: true },
},
],
};
我对
rxjs/operators
也有同样的问题,如中所示。解决方案是将路径添加到.eslintrc.js
中的核心模块设置中。这个解决方案不是很好,但比禁用规则要好
设置:{
“导入/核心模块”:['@apollo/client/link/context']
}
其他一些人在最近版本的eslint plugin import
中对这个问题进行了详细说明,但是v2.23.4中对包解析算法进行了修复
npm更新eslint插件导入
救了我一天,谢谢!我可以问一下为什么不好吗?规则应该能够解析嵌套包。这个答案可以提供一个解决方案,直到这个问题得到解决,并且您可以升级。