javascriptnode.jsreactjsreact-nativeeslint

ESLint import sort grouping


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"]
  }]

Solution

  • 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.