eslint/prettierの競合でDelete'・・・・'というエラーが消えない

Question

eslintを走らせる際にprettierのコード整形も適用されるように設定しているのですが、Reactで三項演算子を使った場合に下記のエラーが発生し、コードを保存しても自動で整形されず、クイックフィックスでも対応できない状況です。（このエラー以外は正しく機能しています）

endOfLine: "auto"が解決策として挙がっていたので試してみたのですが変わりませんでした。

解決する方法をご存知の方いらっしゃいましたらご教授いただけると幸いです。

該当のエラー

.eslintrc.js

module.exports = {
  env: {
    browser: true,
    es2020: true,
    node: true,
  },
  extends: ['eslint:recommended', 'plugin:react/recommended', 'prettier'],
  parserOptions: {
    ecmaFeatures: {
      jsx: true,
    },
    ecmaVersion: 11,
    sourceType: 'module',
  },
  plugins: ['react', 'prettier', 'react-hooks'],
  rules: {
    'prettier/prettier': 'error',
    'react/prop-types': 'off',
    'react/react-in-jsx-scope': 'off',
    'no-unused-vars': 'off',
    'react-hooks/rules-of-hooks': 'error',
    'react-hooks/exhaustive-deps': 'warn',
  },
  settings: {
    react: {
      version: 'detect',
    },
  },
};

.prettierrc.js

module.exports = {
  printWidth: 80,
  tabWidth: 2,
  singleQuote: true,
  semi: true,
  trailingComma: "es5",
  bracketSpacing: true,
  arrowParens: "avoid",
  endOfLine: "auto"
};

package.json

{
  "name": "nextjs-eslint-prettier-template",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next src/",
    "build": "next build src/",
    "start": "next start src/",
    "lint": "eslint . --ext .js,.jsx"
  },
  "dependencies": {
  （略）
  },
  "devDependencies": {
    "eslint": "^7.11.0",
    "eslint-config-prettier": "^6.14.0",
    "eslint-plugin-prettier": "^3.1.4",
    "eslint-plugin-react": "^7.21.5",
    "eslint-plugin-react-hooks": "^4.2.0",
    "prettier": "^2.1.2"
  }
}

Comments

[itepechi]

提供いただいた情報では問題を再現できませんでした

画像：https://git.io/JkGy0

Answer 1

はじめまして．
vscodeをお使いでしょうか？

私も同様のエラーが起きておりました．
原因はvscodeの設定で，以下のようにセーブ時の整形のフックスを二重で設定していることでした．

以下，vscodeのsettings.json

{
  // (省略),
  "editor.formatOnSave": true,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  }
}

なので，以下のようにsettings.jsonより，formatOnSaveを削除すると解決しました．

{
  // (省略),
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  }
}