reactjs - jsxのeslintによるインデント

Question

シンプルなコンポーネントを作ろうとしています。しかし、クリックすると次のようにctrl + sなります。

警告とエラーは次のとおりです。

[eslint] 開始のインデントと一致する終了タグが必要です。(react/jsx-closing-tag-location) [eslint] 4 つのスペース文字のインデントが予期されていましたが、2 が見つかりました。 (react/jsx-indent)

私の.eslintrc：

{
  "extends": "airbnb",
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true,
      "experimentalObjectRestSpread": true
    }
  },
  "rules": {
    "max-len": ["warn", 120],
    "indent": ["warn", 2],
    "react/jsx-indent": ["warn", 4],
    "react/forbid-prop-types": 0,
    "semi": [2, "never"],
    "no-underscore-dangle": 0,
    "no-console": 0,
    "linebreak-style": 0,
    "comma-dangle": [2, {
      "arrays": "never",
      "objects": "always",
      "imports": "never",
      "exports": "never",
      "functions": "ignore"
    }]
  },
  "globals": {
    "localStorage": true
  },
  "env": {
    "browser": true,
    "node": true
  }
}

どうしたの？