CODEWITHSUNDEEP
eslintprettier
ParkDyel
ParkDyel

Reputation: 312

bracket issue use prettier with eslint

I use prettier with eslint in vs code as follow setting.

//.eslintrc
{
  "parser": "babel-eslint",
  "root": true,
  "extends": [
    "airbnb",
    "plugin:vue/essential",
    "plugin:prettier/recommended",
    "eslint:recommended"
  ],
  "rules": {
    "no-console": 0
  }
}


//.prettierc
{
  "printWidth": 100,
  "singleQuote": true,
  "jsxBracketSameLine": true
}

but some eslint recommend conflict autoformatting from prettier.

prettier make code like this.

import { mapGetters, mapActions } from 'vuex'

(autosaving)

import {
  mapGetters,
  mapActions
} from 'vuex'

but now eslint draw red line.

// example
Replace `␍⏎··mapActions,␍⏎··mapGetters␍⏎` with `·mapActions,·mapGetters·`eslint(prettier/prettier)

I don't want eslint red line anywhere...

so I was found some document, but cannot found prettier setting..

how disable this red line?

Upvotes: 0

Views: 7088

Answers (1)

AshTyson
AshTyson

Reputation: 493

Since prettier is very opinionated, it might cause trouble with es-lint sometimes. You might want to use a library like prettier-eslint

This will format your code with prettier, then try to fix it with eslint. You can probably disable the conflicting rules as described in the prettier docs.

https://prettier.io/docs/en/eslint.html

They've mentioned adding

{ "extends": ["prettier"] }

to your .eslintrc.json might help along with other configuration.

Upvotes: 1

Related Questions