How to lint/fix JSON files with this plugin?

[caugner]

What version of eslint are you using?

7.0.1

What version of prettier are you using?

2.0.5

What version of eslint-plugin-prettier are you using?

3.1.3

Please paste any applicable config files that you're using (e.g. .prettierrc or .eslintrc files)

// package.json
{
  // ...
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/recommended",
      "@vue/prettier/recommended"
    ],
    "rules": {},
    "parserOptions": {
      "parser": "babel-eslint"
    }
  },
  "prettier": {
    "htmlWhitespaceSensitivity": "strict"
  },
  // ...
}}}

What source code are you linting?

{
    "json_example": { "with": "wrong_format" }
  }

What did you expect to happen?

ESLint should use prettier to lint the JSON file.

What actually happened?

ESLint lints the JSON file as if it's a JavaScript file and complains about a missing semi-colon.

[BPScott]

ESLint doesn't understand JSON and the majority of eslint rules don't apply to JSON files. It kinda works by accident as ESLIint sees the JSON as valid JavaScript.

You shouldn't pass non-js files into eslint unless you've got a plugin to explicitly handle that (and even then interaction with this plugin gets a little weird). Instead you should run prettier over your json files in a separate step instead of trying to smush it into your eslint workflow

[caugner]

@BPScott There are eslint-plugin-json and eslint-plugin-i18n-json, both of which lint JSON files, so I'm a bit surprised that this wouldn't at all be possible with eslint-plugin-prettier?

Ideally I would like to configure to use the eslint-plugin-prettier plugin exclusively for JSON files. Like this there would be no issue with ESLint's own rules not being compatible with JSON.

[BPScott]

Sure, they're packages for adding preprocessors that teach ESLint about new file types. eslint-plugin-prettier aims to be just a rule - it deliberately doesn't want to start wrangling ESLint preprocessors as that's out of scope for what I want it to to care about.

What you might want to do follow the path of vue, and markdown, and create a separate plugin that teaches ESLint how to handle that file type, an then we can add a special case for interacting with that plugin

[vaclav-slavik]

@BPScott I'try to revive this with the follow-up. Last month, ESlint introduced official support for JSON linting utilising new @eslint/json plugin.

Is this the right time to ask about about adding a the interaction mentioned here?

What you might want to do follow the path of vue, and markdown, and create a separate plugin that teaches ESLint how to handle that file type, an then we can add a special case for interacting with that plugin

[anomiex]

Looks like that happened in #743 👍