reactjs - eslint 缩进规则没有被禁用
问题描述
我正在尝试让更漂亮和 eslint一起jsx
工作
const ResponseModule = ({ response }) => (
<div>
{response.code === 401 ? (
<div className="response">
<div className="response-content">
<h1> {response.message} </h1>
<button onClick={() => initLogout()}> Login to continue </button>
</div>
</div>
) : null}
</div>
);
我收到这样的缩进错误
[eslint] Delete `..` [prettier/prettier]
现在,当我应用自动修复时,它变成了这个
const ResponseModule = ({ response }) => (
<div>
{response.code === 401 ? (
<div className="response">
<div className="response-content">
<h1> {response.message} </h1>
<button onClick={() => initLogout()}> Login to continue </button>
</div>
</div>
) : null}
</div>
);
当我在 vs 代码中点击保存 (CTRL+S) 时,它只是回到第一种格式,因此再次给我同样的错误..我无法继续工作..
这是我的 eslint 配置
{
"env": {
"browser": true
},
"extends": [
"airbnb",
"plugin:prettier/recommended"
],
"parser": "babel-eslint",
"rules": {
"no-tabs": 0,
"indent": 0,
"no-underscore-dangle": 0,
"react/prop-types": 0,
"linebreak-style": [
"error",
"windows"
],
"jsx-closing-tag-location": 0,
"class-methods-use-this": 0,
"import/no-named-as-default": 0,
"react/jsx-filename-extension": [
"error",
{
"extensions": [
".js",
".jsx"
]
}
]
},
"plugins": [
"prettier"
]
}
这些是我拥有的 eslint/prettier 包相关
"eslint": "^5.3.0",
"eslint-config-airbnb": "^17.1.0",
"eslint-config-prettier": "^3.1.0",
"eslint-plugin-import": "^2.14.0",
"eslint-plugin-jsx-a11y": "^6.1.1",
"eslint-plugin-prettier": "^3.0.0",
"eslint-plugin-react": "^7.11.0",
"prettier": "1.14.3",
解决方案
您还需要禁用react/jsx-indent
,该规则由启用eslint-config-airbnb
。
推荐阅读
- performance - 负载测试 api 时 IIS 对几乎备用请求的 403 错误响应
- python - 无法安装整齐
- php - 当我直接访问保护登录页面时,Laravel 将用户重定向到核心身份验证登录页面
- java - 执行自动扩缩时,Cloud Dataflow 会抛出异常吗?
- javascript - ajax call xhr 在代码成功前显示 100%
- angular - 带有 AzureGraph API 的 Angular 发送邮件 + 附件
- go - 从切片中选择随机值并在 cli 上打印
- ios - 其他开发者的应用程序如何知道他们与我的应用程序共享文件?
- python - 运行时出现 InvalidArgumentError :model.train_and_evaluate()
- excel - 在用户表单中,当我遇到空格时,我只想给出一条错误消息,只删除空格?