Prettier-vscode: Prettier eslint integration is not working

[ghost]

Hello,

the "prettier.eslintIntegration": trueis not working. I tried to install prettier-eslint as local and global package and it was the same. I tried to use eslint as local and as global package and it was the same. I even tried to install all three packages including prettier to local and global and it was the same. I tried different variations and it wasn't working. I mean it's formatting, but it doesn't do eslint --fix.

The Prettier output is clean, it has in sidebar ✓ symbol. ESLint output is good too.

VS Code: 1.14.2
macOS Sierra: 10.12.6 (16G29)

[RobinMalfait]

Could you share your eslint file and an example input file and the end result?

[ghost]

Code:

const aFn = (data) => console.log(data);

Prettier formats to:

const aFn = data => console.log(data);

ESLint:

{
    "rules": {
        "arrow-parens": "error"
    }
}

ESLint is globally installed.

[RobinMalfait]

I don't know the json representation for this, but when I use the yaml syntax it works with this:

---
  env:
    es6: true
  rules:
    arrow-parens:
      - 2
      - always

[RobinMalfait]

Note that the es6 env is required because of the const and arrow function syntax.

[ghost]

I have es6.

    "env": {
        "browser": true,
        "commonjs": true,
        "es6": true,
        "node": true
    },

[CiGit]

What @RobinMalfait meant was, in json form
"arrow-parens": ["error", "always"]
http://eslint.org/docs/rules/arrow-parens
Your arrow-parens seems wrongly configured.

[RobinMalfait]

Yes indeed, like @CiGit said. This works for me:

{
  "env": {
    "es6": true
  },
  "rules": {
    "arrow-parens": ["error", "always"]
  }
}

Can you confirm that this solves your issue, @bsvipas ?

[ghost]

@CiGit @RobinMalfait It's configured good, ESLint works in both ways if you left only "error" or ["error", "always"]. I tried to use ["error", "always"] and it wasn't working (I'm talking about Prettier). Using one param for e.g. "warn" or "error" always works if that rule have default type in this example "arrow-parens" default type is always. I can use both approaches "error" or ["error", "always"] and ESLint always works without any problems.

I tried on new and clean project with only index.js and .eslintrc.json:

{
    "env": {
        "es6": true
    },
    "rules": {
        "arrow-parens": "error"
    }
}

And it was working! Prettier doesn't remove the parens, BUT how to fix that on my project? I think maybe it can be, because that project is having 2 ESLint files and both are not in root, the structure is like this:

root ->

• api ->
  
  
  
  • .eslintrc.json
  
  
  • other files
  
  
• frontend ->
  
  
  
  • .eslintrc.json`
  
  
  • other files
  
  
• other files, but no .eslintrc.json in root

I configured my VS Code workspaces settings to use ESLint config from frontend folder and it's working for ESLint, but Prettier is not working, I even tried to add .eslintrc.json in the root, but Prettier still is not working... Maybe we need new prettier setting to show where is and which ESLint config to use? Or Prettier is communicating with ESLint to know correct place of config?

In short: Prettier is working if everything is in root, but if I have different structure it doesn't working, but ESLint does. I mean it's formatting, but not respecting ESLint configuration even if integration is true.

[CiGit]

We don't communicate with eslint extension. We use prettier-eslint. And due to how it works, there is no root folder for eslint.
Have you installed eslint in your project?

[ghost]

@CiGit Yes, I installed it. As I said I tried to do everything, install it global, local, but nothing helps.

[CiGit]

Globally should help much. We don't use it.
How did you install it locally ?
Was it installed in your test repo ? Versions?

[lucasfeliciano]

Same thing here:

Prettier is running but prettier-eslint it isn't
I have prettier-eslint installed locally

[lucasfeliciano]

I got the problem:

"prettier.eslintIntegration": true
Need to be set in the editor config file.

Not on .prettierrc/package.json/.prettier.config.js

[ghost]

Seems everything fine for me, I guess I can close this issue.

[yinsang]

@lucasfeliciano I set "prettier.eslintIntegration": truein vscode setting ，then it works.

[kirkbross]

"prettier.tslintIntegration" and "prettier.eslintIntegration" in VSCode both give me "Unknown Configuration Setting" error.