ESLint 导入排序分组

Question

In my node project, I use ESLint. I want to sort imports. I configured it and now everything works fine. But, I can't group imports and sort.

import request from 'request';

import { asyncHandler } from 'middleware';
import { githutOptions } from 'constants/options.constant';

import profileService from 'services/profile.service';

Here, I get a warning saying Imports should be sorted alphabetically. on second line. (asyncHandler)

Why doesn't this get sorted based on grouping? In another project I had worked with, if there are several grouped imports, the are sorted only inside those groups.

But here, even I grouped these imports, it consider the whole file, so asyncHanler should go as the first line. What I want here is to sort import only inside groups.

How can I achieve this?

These are my eslint rules for sorting imports.

 "sort-imports": ["error", {
      "ignoreCase": false,
      "ignoreDeclarationSort": false,
      "ignoreMemberSort": false,
      "memberSyntaxSortOrder": ["none", "all", "single", "multiple"]
  }]

Answer 1

That's exactly what ignoreDeclarationSort does: if it's true then ESLint will ignore import lines. And if ignoreMemberSort is false it will check ordering for named imports.

So

 "sort-imports": ["error", {
      "ignoreCase": false,
      "ignoreDeclarationSort": true,
      "ignoreMemberSort": false,
      "memberSyntaxSortOrder": ["none", "all", "single", "multiple"]
  }]

should work for you.

Answer 2

eslint added what you're looking for with the allowSeparatedGroups option of sort-imports in version 7.5.0

cf:

• documentation :https://eslint.org/docs/rules/sort-imports#allowseparatedgroups
• pull request : https://github.com/eslint/eslint/pull/13455