[英]Configuration for rule "react/jsx-indent" is invalid: Value "4,[object Object]" should NOT have more than 1 items
I've arrived at work today to an unusual error coming from my linter package.我今天上班时遇到了来自我的 linter package 的异常错误。 I've had a look at the documentation for the package and I can't see any issues with my eslintrc file.
我查看了 package 的文档,但我的 eslintrc 文件看不到任何问题。
Here is a copy of what I'm using这是我正在使用的副本
{
"extends": "airbnb",
"parser": "babel-eslint",
"rules": {
"import/no-extraneous-dependencies": "off",
"import/extensions": "off",
"import/no-unresolved": "off",
"eol-last": "off",
"no-unused-expressions": ["error",{
"allowTernary": true,
"allowShortCircuit": true
}],
"react/jsx-indent-props": "off",
"react/jsx-indent" : ["error", 4, { "props": 4 }],
"indent": [ "error", 4],
"react/jsx-filename-extension": "off",
"jsx-a11y/anchor-is-valid": [
"error",
{
"components": [],
"specialLink": [
"hrefLeft",
"hrefRight"
],
"aspects": [
"noHref",
"invalidHref",
"preferButton"
]
}
],
"no-bitwise": "off"
},
"env": {
"browser": true,
"jest": true
}
} }
I'm not having any problems when I run eslint from the command line which makes this even more confusing!当我从命令行运行 eslint 时,我没有任何问题,这使得这更加令人困惑!
Any help would be greatly appreciated:)任何帮助将不胜感激:)
Just incase anyone runs into this problem in the future, I spotted the issue. 万一将来有人遇到这个问题,我发现了这个问题。
"react/jsx-indent" : ["error", 4, { "props": 4 }],
should be 应该
"react/jsx-indent" : ["error", 4],
I think someone was trying to get fancy with destructuring :P 我认为有人想通过销毁:P
As Fabio already figured out, props was added incorrectly.正如 Fabio 已经发现的那样,道具添加不正确。 For anyone wanting to add props, you can see this disabled in the line above
"react/jsx-indent"
.对于任何想要添加道具的人,您可以在
"react/jsx-indent"
上方的行中看到此禁用。
So you could just change this line "react/jsx-indent-props"
and clean up the following line with:所以你可以改变这一行
"react/jsx-indent-props"
并清理以下行:
"react/jsx-indent" : ["error", 4]
"react/jsx-indent-props": ["error", 4]
A further note: If you are experiencing an error with props indentation on ternary items, then instead of setting a number, you can use "first"
to align with the tags first prop.进一步说明:如果您在三元项目上遇到道具缩进错误,那么您可以使用
"first"
来与标签第一个道具对齐,而不是设置数字。
"react/jsx-indent-props": ["error", "first"]
This should avoid errors when your JSX looks something like this:当您的 JSX 看起来像这样时,这应该可以避免错误:
return (
{showComponent
? <MyComponent
option="1"
onClick={myCompHandler}/>
: <p>Something Else</p>
}
)
For more information: https://github.com/jsx-eslint/eslint-plugin-react/blob/master/docs/rules/jsx-indent-props.md更多信息: https://github.com/jsx-eslint/eslint-plugin-react/blob/master/docs/rules/jsx-indent-props.md
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.