Imports still not sorting correctly

[wbhob]

I am getting the issue, that if I import from a submodule, it won't sort by packages, demonstrated below. You'll notice that there are imports from @nestjs/core both above and below the break between package and relative imports.

[wbhob]

Upon closer look, it seems that they are sorting by quantity, then alphabetically by import name. I'd like to request a feature that it sorts alphabetically by package/path, then by quantity and import name.

[amatiasq]

Hi @wbhob, yes I have the same issue with scoped modules (@).

I just need a little explanation on what do you mean by "sorting by quantity".

In any case if it's implemented it won't be possible to do it in the default style eslint because then the eslint rule is going to notify it as an error.

Can you paste the content of your screenshot so I can try it with different sorting styles?

[wbhob]

Yes, so by "quantity", I mean that the packages with more imports come first: notice the first has 9 imports, the second has 2, and the rest have 1.

import { CanActivate, ExceptionFilter, INestMicroservice, Logger, NestInterceptor, OnModuleDestroy, PipeTransform, WebSocketAdapter } from '@nestjs/core';
import { isNil, isUndefined } from '@nestjs/core/utils/shared.utils';

import { ApplicationConfig } from '@nestjs/core/application-config';
import { CustomTransportStrategy } from './interfaces/custom-transport-strategy.interface';
import { MicroserviceConfiguration } from './interfaces/microservice-configuration.interface';
import { MicroservicesModule } from './microservices-module';
import { Module } from '@nestjs/core/injector/module';
import { NestContainer } from '@nestjs/core/injector/container';
import { Server } from './server/server';
import { ServerFactory } from './server/server-factory';
import { SocketModule } from '@nestjs/websockets/socket-module';
import { Transport } from './enums/transport.enum';
import iterate from 'iterare';
import { messages } from '@nestjs/core/constants';

[amatiasq]

Yeah, this is weird, the default sorting style is import-sort-style-eslint, I don't agree with this style but looks like it's the most popular. It sorts by imported names.

It is made to fulfill this ESLint rule so you can see here how it works. As you see looks like it's separating imports with multiple identifiers and imports with single identifier and then it's sorting each group alphabetically (uppercase first).

You can switch to a different sorting style by adding this to you package.json.

[amatiasq]

Looks like the issue was solved by switching sorting style. Closing it.

Please reopen if issue continues.

[wbhob]

I am still unable to set this properly. I set this:

  "importSort": {
    ".ts": {
      "parser": "typescript",
      "style": "import-sort-style-module"
    }
  }

with no changes. More importantly, this should be a global option. I don't want to set this for each of my dozens of projects.

[amatiasq]

This is weird, I'm using the typescript parser in a project and I can see it working now. Are you using react? if you have some .tsx files this configuration won't work.

About the global option, it's the reason why I made this fork but I had to rollback when the original plugin was deprecated. You can follow the discussion in #5

[wbhob]

How do I set it exactly? The docs are vague about the exact string I have to use.

[wbhob]

Also, I’m not using react, just regular old .ts files

[amatiasq]

I haven't got deep into the library's implementation. I took the one from that docs and it worked. If you copy it does it still fail?

[wbhob]

If I copy from the docs, it still uses the same ESLint style. I need the module sort type, which I can not find.

[amatiasq]

Oh! now I see, may it be that "style": "import-sort-style-module" is not expected to get the whole module name, you can skip the import-sort-style- part. Maybe that's your issue.