Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support for 'type' imports #27

Closed
smashercosmo opened this issue Jun 17, 2020 · 8 comments · Fixed by #50
Closed

Support for 'type' imports #27

smashercosmo opened this issue Jun 17, 2020 · 8 comments · Fixed by #50

Comments

@smashercosmo
Copy link

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
Copy link
Owner

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
Copy link

I will try to develop this

@zb140
Copy link

zb140 commented Nov 5, 2020

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
Copy link

Mikael-R commented Nov 5, 2020

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
Copy link

zb140 commented Nov 6, 2020

I've put together a prototype of my second suggestion (group as normal, then sort each group by kind, then by name) over here: zb140@11ccd3c . 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
Copy link
Author

Now we can just port it to eslint-plugin-import-helpers :)
import-js/eslint-plugin-import#2021

@yulya9060
Copy link

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

@willhoney7
Copy link
Owner

Released as 1.3.0

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

6 participants