Ensure absolute imports come before relative imports

[ismail-syed]

Ensure absolute imports (typically 3rd party modules) come before relative imports (local modules).

Ex:

Good:

import * as React from 'react';
import {render} from 'react-dom';
import * as styles from './someStyles.scss';

Bad: Good:

import * as styles from './someStyles.scss';
import * as React from 'react';
import {render} from 'react-dom';

[GoodForOneFare]

What will this do that ordered-imports doesn't?

[ismail-syed]

ordered-imports seems to only support individual imports being alphabetized.

import {A, B, C} from 'foo';

We'll need a custom rule to check that absolute imports (typically 3rd party modules) come before relative imports (local modules).

[GoodForOneFare]

Cool 👍

[GoodForOneFare]

The ordered-imports tests show this as a failure:

import * as abc from 'abc';
import * as foo from 'foo';
import * as bar from 'bar'; // failure

It seems like enforcing this rule would get us some way to enforcing a specific order.

[ismail-syed]

I believe that's a failure because it's not alphabetized.

For this custom rule, I don't think we're focusing on alphabetizing imports. More so for splitting up absolute/relative imports.

[GoodForOneFare]

. can be alphabetized. Or does the rule only act on the final part of the path?

[ismail-syed]

I don't know how well the ordered-import rule plays with relative paths (ie: paths with ../ or ./)

With ordered-import there's are only two things you can config:

• import-sources-order: Control the ordering of source imports. (The module names them self)

  • eg

    import * as bar from 'bar';
    import * as foo from 'foo';

• named-imports-order : Control the ordering of named imports. (The variables being imported within {})

  import {A, B, C} from 'foo';

I think we should enable ordered-imports with named-import-order turned on. To keep long component imports consistent. @lemonmade, what are you thoughts on that?

[lemonmade]

Personally, I have no interest in forcing the ordering, we typically avoid alphabetic ordering rules (in CSS, for example) because there really is no rhyme or reason to it, whereas there are more high-value rules that have some justification

[ismail-syed]

Okay. Are you okay with a custom rule for ensuring absolute imports come before relative imports?

[lemonmade]

Yeah, for me, that one makes more sense than alphabetical ordering