CODEWITHSUNDEEP
reactjstypescriptsortingeslinttypescript-eslint
keogh
keogh

Reputation: 520

eslint sort-imports mixing single and multiple

I've got a CRA app setup with eslint, and I use vscode using the sort-imports extension. All linting seems to work as I want, apart from the sort-imports rule. It seems to be allowing the mixing of single and multiple imports.

Here is my .eslintrc sort-imports rule:

"sort-imports": [
  "error",
  {
    "memberSyntaxSortOrder": [
      "all",
      "single",
      "multiple",
      "none"
    ],
    "allowSeparatedGroups": true
  }
],

And an example of what is wrong:

import { Readonly } from "components/Form/Readonly";
import { Summary } from "components/Heading/Summary";
import axios from "axios";
import { config } from "system/config";
import qs from "qs";
import { useLoader } from "components/Loading";

sort-imports likes this and eslint doesn't complain about it either. Am I missing something, or should eslint be complaining about this? It is clearly mixing single with multiple right?

If I change it to how I want it:

import axios from "axios";
import qs from "qs";

import { Readonly } from "components/Form/Readonly";
import { Summary } from "components/Heading/Summary";
import { config } from "system/config";
import { useLoader } from "components/Loading";

eslint doesn't seem to complain, but sort-imports will put it right back how it was above.

So I suppose my issue is with the sort-imports extension... but I still think eslint should be complaining about me mixing these imports.

Upvotes: 3

Views: 2317

Answers (1)

Brad Zacher
Brad Zacher

Reputation: 3243

Whilst the docs aren't entirely clear - from what I can tell looking at the rule's source (https://github.com/eslint/eslint/blob/896273f9d75c973ce2c7cc25580ae667a10ec6f9/lib/rules/sort-imports.js#L77-L99), import { foo } from 'module' is counted as a "single" import, because it imports one thing - same as import def from 'module' also is a "single" import.

import { foo, bar } from 'module' is a "multiple", as it imports multiple things.

Upvotes: 2

Related Questions