よりきれいに

📌 Prettier の設定

ここでは、Prettier を ESLint と共に構成するために 2 つの依存関係をインストールします.または、first は Prettier と ESLint の間の競合するルールを無効にし、second は Prettier とその設定を Rules ESLint に変換するため、2 つを統合できます.

yarn add -D prettier eslint-config-prettier eslint-plugin-prettier

.eslintrc ファイルをもう一度更新しましょう.キーは extends 、 plugins 、 rules のままにします.以下の例では、react を使用して構成します.

extends: [
  "eslint:recommended",
  "prettier/react",
  "airbnb",
  "plugin:react/recommended",
  "plugin:prettier/recommended"
],

plugins: ['react', 'prettier'],
rules: {
    'prettier/prettier':  'error',
}

最後に、.prettierrc.json ファイルを作成し、次のように構成します.

{
  "trailingComma": "es5",
  "tabWidth": 2,
  "semi": true,
  "singleQuote": true,
  "jsxSingleQuote": true
}