Удалить `(` eslint (красивее/красивее)

У меня конфликт правил. Когда я заключаю в скобки многострочный JSX, красивее сообщает об ошибке Delete `(` eslint (prettier/prettier).

введите здесь описание изображения

Но если я уберу скобки, у меня будет другая ошибка eslint Missing parentheses around multilines JSX eslint(react/jsx-wrap-multilines)

введите здесь описание изображения

<ScreenLayout
    content={(  <--------- problems here
    <Component
      // any props...
      // any props...
    >
      // any components...
      // any components...
      // any components...
    </Component>
  problems here ------> )}
/>

Я понимаю, что правильно использовать скобки. Как исправить эту Delete `(` eslint (prettier/prettier) проверку?

Мои devзависимости

"@babel/cli": "^7.12.10",
"@babel/core": "^7.12.3",
"@babel/plugin-proposal-class-properties": "^7.12.1",
"@babel/plugin-transform-runtime": "^7.12.1",
"@babel/preset-env": "^7.12.11",
"@babel/preset-react": "^7.12.10",
"@babel/preset-typescript": "^7.12.1",
"@testing-library/jest-dom": "^5.11.6",
"@testing-library/react": "^11.2.2",
"@types/jest": "^26.0.19",
"@types/react-dom": "^16.9.10",
"@types/react-redux": "^7.1.12",
"@types/react-responsive": "^8.0.2",
"@types/react-router-dom": "^5.1.7",
"@types/styled-components": "^5.1.7",
"@typescript-eslint/eslint-plugin": "^4.14.2",
"@typescript-eslint/parser": "^4.14.2",
"babel-jest": "^26.6.3",
"babel-loader": "^8.1.0",
"browserslist": "^4.16.0",
"connect-history-api-fallback": "^1.6.0",
"cross-env": "^7.0.3",
"css-loader": "^4.3.0",
"eslint": "^7.19.0",
"eslint-config-airbnb": "^18.2.1",
"eslint-config-airbnb-base": "^14.2.1",
"eslint-config-prettier": "^7.2.0",
"eslint-import-resolver-typescript": "^2.3.0",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-jest": "^24.1.3",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-prettier": "^3.3.1",
"eslint-plugin-react": "^7.22.0",
"eslint-plugin-react-hooks": "^4.2.0",
"jest": "^26.6.0",
"jest-css-modules-transform": "^4.1.0",
"jest-sonar-reporter": "^2.0.0",
"jest-trx-results-processor": "^2.2.0",
"node-sass": "^5.0.0",
"prettier": "^2.2.1",
"sass-loader": "^8.0.2"

eslint prettier prettier-eslint
person Eduardo Dallmann    schedule 01.02.2021    source источник
comment
Не могли бы вы решить проблему? Я столкнулся с той же проблемой   -  person user3216381    schedule 12.02.2021
comment
К сожалению еще не решил   -  person Eduardo Dallmann    schedule 12.02.2021
comment
любые обновления? такая же проблема   -  person Danf    schedule 24.02.2021

Ответы (2)


arrow_upward
2
arrow_downward

Столкнулся с той же проблемой. В частности, мне не нравятся дополнительные скобки внутри моих реквизитов. Поэтому отключение правила должно решить вашу проблему.

Добавьте это в свой .eslintrc.json внутри rules:

      "react/jsx-wrap-multilines": "off"
person Pedro Henrique Bufulin    schedule 11.05.2021

arrow_upward
1
arrow_downward

Конфликт возникает из-за того, что в линтерах есть не только правила качества кода, но и стилистические, поэтому при использовании Prettier у вас будут конфликтующие правила.

Чтобы исправить это, я отключил эти правила в линтере, чтобы он заботился о качестве кода, а Prettier заботился о внешнем виде.

Вы можете установить такой пакет, как eslint-config-prettier.

npm install --save-dev eslint-config-prettier

А затем расширить линтер следующим образом:

{ extends: [какая-то другая конфигурация, которую вы используете, более красивая]}

Ознакомьтесь с репозиторием: https://github.com/prettier/eslint-config-prettier

person Danf    schedule 24.02.2021