Improper order of imports with Hyphens and Periods in the paths

Hi @lydell,

Kudos

We are trying to convert an Angular 10 application from the deprecated tsLint dependency to using eslint. There were strong recommendations to use this eslint plugin. And I agree with the recommendations - your extensive research is well documented with every reasoning and finding there is to know about sorting import statements within Javascript / TypeScript files. Good work!

Issue

However, there is one thing bothering me while using this plugin. In my opinion, your plugin seems to incorrectly sort import statements which have the same set of characters from the beginning of the “from path string” followed by:

1. a hyphen character (- a.k.a. the hyphen-minus unicode character U+002D)
2. versus a period character (. a.k.a the full-stop unicode character U+002E).

Example from path strings

1. 'my-package' vs 'my.package' (Common part = 'my)
2. './widget/abc-def.tsx' vs './widget/abc.defgh.tsx' (Common part = './widget/abc)
3. '../notification-list-routing.module.ts' vs '../notification-list.component.ts' (Common part = '../notification-list)

According to normal string sorting, hyphens come before periods. However, the default configuration of this plugin, seems to sort the from path strings containing periods first followed by the hyphen character.

Example

The following import sequence seems to be correct in my opinion (as well as TSLint’s ordered-import rule).

import { fileNameWithHyphens } from './file-with-hyphens.js';
import { fileNameWithPeriods } from './file.with.periods.js';

is auto-fixed into:

import { fileNameWithPeriods } from './file.with.periods.js';
import { fileNameWithHyphens } from './file-with-hyphens.js';

Sample Repository

To demonstrate this issue clearly, I have created a small sample plain-vanilla JavaScript-based NodeJS 14.x compatible application here: https://github.com/akaustav/import-order-test. The index.js file disables your plugin rule on line 1 - otherwise the simple-import-sort/imports rule keeps complaining about the order of the import lines on line 2 and 3. It even uses your documented comparator function - see this file.

Question

Is this expected behavior?

Ameet

[akaustav]

@lydell - I think I understand your requirement a bit better now after looking at the sorting expectations outlined between lines 880 and 992 - why you wanted to sort . and / before other special characters. And I am starting to see the problem too - more to follow.

https://github.com/lydell/eslint-plugin-simple-import-sort/blob/7aa4e22b94adde01a66079d13cf48b3aaca9904d/test/imports.test.js#L880-L928

[lydell]

I will try to analyze each of the regular expressions and determine which code line might be causing this switch.

It’s the one with the switch:

https://github.com/lydell/eslint-plugin-simple-import-sort/blob/7aa4e22b94adde01a66079d13cf48b3aaca9904d/src/shared.js#L812-L826

version history

Have you looked into using a .git-blame-ignore-revs file?

For me personally, I don’t care about git history for imports. To me, imports are basically “useless” code that I collapse in my editor. I automatically import what’s needed. There’s no logic in them, so it’s not interesting to git blame.

It was flagged by one of our senior developers and the PR wouldn’t be approved until I fix this problem.

Note that tslint compatibility is not a goal of this plugin. I created this plugin before I even used TypeScript.

I think your next steps are:

1. Research what can be done about this.
2. Post your results here.
3. Make a PR or fork this plugin. I might be able to fix this instead, depending on the results of your research. Note that if the code becomes much more complicated I might not be interested in merging.