Получение Prettier и ESLint для приятной игры в VS Code - PullRequest
Новая
       168

Получение Prettier и ESLint для приятной игры в VS Code

0 голосов
/ 09 июля 2020

Я пытаюсь использовать Prettier для форматирования в VS Code вместе с ESLint в приложении Gatsby React, и они, кажется, борются друг с другом. Например, у меня есть следующий код JavaScript / React: 

Made with
{' '}
<Link
  to="https://kontent.ai/"
  target="_blank"
  rel="noopener noreferrer"
>
Kentico Kontent
</Link>

, который Prettier в VS Code настаивает на изменении на это: 

Made with{' '}
<Link
  to="https://kontent.ai/"
  target="_blank"
  rel="noopener noreferrer"
>
Kentico Kontent
</Link>

, который затем нарушает реакцию ESLint / jsx -one-expression-per-line, поэтому я получаю бесконечное l oop. У меня есть то, что я считаю довольно стандартной конфигурацией, с eslint-plugin-prettier и настройкой ESLint для расширения prettier. Вот мой .eslintr c: 

{
  "parser": "babel-eslint",
  "extends": ["prettier", "airbnb"],
  "plugins": ["import", "jsx-a11y", "react", "prettier"],
  "globals": {
    "graphql": true,
    "window": true
  },
  "rules": {
    "arrow-body-style": [
      "error",
      "as-needed",
      { "requireReturnForObjectLiteral": true }
    ],
    "arrow-parens": ["error", "as-needed"],
    "comma-dangle": ["error", "always-multiline"],
    "function-paren-newline": "off",
    "no-console": "off",
    "prefer-destructuring": "off",
    "prettier/prettier": "error",
    "semi": ["error", "always"],
    "import/extensions": "off",
    "import/no-extraneous-dependencies": "off",
    "jsx-a11y/anchor-is-valid": "off",
    "react/jsx-filename-extension": "off",
    "react/prefer-stateless-function": "off",
    "react/prop-types": "off"
  }
}

, а это мой .prettirr c: 

{
  "printWidth": 80,
  "singleQuote": true,
  "trailingComma": "es5",
  "bracketSpacing": true,
  "jsxBracketSameLine": false,
  "parser": "babel",
  "semi": true
}

Как мне настроить prettier и ESLint, чтобы они не боролись постоянно друг друга?

...