Support for 'type' imports

[smashercosmo]

now that both flow and typescript support them

import lodash from 'lodash';
import React from 'react';

import SharedComponent from '@shared/components/SharedComponent';

import SiblingComponent from './SiblingComponent';

import type { SiblingComponentType } from './SiblingComponent';

{
    // .eslintrc.js
    plugins: ['eslint-plugin-import-helpers'],
    rules: {
        'import-helpers/order-imports': [
            'warn',
            { // example configuration
                newlinesBetween: 'always',
                groups: [
                    'module',
                    '/^@shared/',
                    ['parent', 'sibling', 'index'],
                    'types', // <-------------------------------
                ],
                alphabetize: { order: 'asc', ignoreCase: true },
            },
        ],
    }
}

[willhoney7]

These would be a great addition! I am happy to accept PRs if you need this quickly.

I'll look into implementing in the future

[mateushnsoares]

I will try to develop this

[zb140]

I'd love to have this feature as well, although in my perfect world it would be possible to sort and group type imports following the same rules as "regular" imports, but after them. So you'd end up with something like this:

import lodash from 'lodash';
import React from 'react';

import SharedComponent from '@shared/components/SharedComponent';

import SiblingComponent from './SiblingComponent';

import type { ComponentType } from 'react';

import type { SharedComponentProps } from '@shared/components/SharedComponent';
import type { OtherComponentProps } from '@shared/components/OtherComponent';

import type { SiblingComponentType } from './SiblingComponent';

Edit: another alternative that just occurred to me would be a way to sort the type imports to the bottom of their respective groups. In other words, imports within a group would effectively be sorted by regular-vs-type first, then alphabetically second. The result would be something like this:

import lodash from 'lodash';
import React from 'react';
import type { ComponentType } from 'react';

import SharedComponent from '@shared/components/SharedComponent';
import type { SharedComponentProps } from '@shared/components/SharedComponent';
import type { OtherComponentProps } from '@shared/components/OtherComponent';

import SiblingComponent from './SiblingComponent';
import type { SiblingComponentType } from './SiblingComponent';

I'd be happy with either one; I would just prefer for imports from all the groups to not be jumbled together in one big alpha-sorted blob 😄

@mateushnsoares Did you have any luck working on this? If not, I might take a look too.

[Mikael-R]

Hi @zb140, @mateushnsoares is without your github access because are with problems with 2FA but he asked for me to me say that he isn't with luck on try develop it and you can try

[zb140]

I've put together a prototype of my second suggestion (group as normal, then sort each group by kind, then by name) over here: https://github.com/zb140/eslint-plugin-import-helpers/commit/11ccd3ce34a8d6440b4fe81cc0a0cf95d0e9d4ed . So far it seems to be working pretty well. All of the tests pass, but I haven't added any new tests with import type in them yet because I haven't figured out how to get the test runner to use @typescript-eslint/parser. In a separate test project, it successfully sorted the examples above.

It's certainly not ready for merge yet, but if anyone has any thoughts, I'd love to hear them.

[smashercosmo]

Now we can just port it to eslint-plugin-import-helpers :) https://github.com/benmosher/eslint-plugin-import/pull/2021

[yulya9060]

hi, when Support for 'type' imports will be in release?

[willhoney7]

Released as 1.3.0