Don't get import/order to work correctly with import aliases
See original GitHub issueNo matter what I try, I don’t get the import/order
plugin to work as expected.
These are the imports, and they are already ordered as expected:
import classNames from 'classnames';
import * as React from 'react';
import { I18N } from '@context/i18n';
import { SVGIcon } from '@ui';
import * as Utils from '@utils';
import * as styles from './styles.scss';
Anyhow, the rule complains about:
classnames
import should occur after import of@utils
react
import should occur after import of@utils
classnames
and react
are located in node_modules
Everything starting with @
indicates an import alias (so I assume they should be interpreted as internal
).
My eslint configuration looks like this:
{
settings: {
'import/parsers': {
'@typescript-eslint/parser': ['.ts', '.tsx']
},
'import/internal-regex': '^@'
},
rules: {
'import/order': ['error', {
'alphabetize': { order: 'asc', caseInsensitive: true },
'groups': ['builtin', 'unknown', 'external', 'internal', 'parent', 'sibling', 'index'],
'newlines-between': 'always'
}]
}
}
I’ve played around since multiple hours now, but don’t get the expected result. The only thing which happens is, that it sometimes say that @utils
should occur before classnames
, and sometimes it says classnames
should occur after @utils
…
What have I missed?
Issue Analytics
- State:
- Created 4 years ago
- Comments:12 (3 by maintainers)
Top Results From Across the Web
eslint import/order breaks down when using typescript aliases
I followed some tips at Don't get import/order to work correctly with import aliases, but this seems to be the last hurdle. We...
Read more >useless-import-alias / C0414 - Pylint 2.16.0-dev documentation
Import alias does not rename original package. Description: Used when an import alias is same as original package, e.g., using import numpy as...
Read more >Module Resolution or Import Alias: The Final Guide - Raul Melo
Tired to have weird imports? It's time to learn how can you enable aliases to your imports and let code more organized.
Read more >Imports - checkstyle
Checks that there are no import statements that use the ... All messages can be customized if the default message doesn't suit you....
Read more >Auto import | IntelliJ IDEA Documentation - JetBrains
Basic procedures to create and optimize imports in IntelliJ IDEA. ... prompting to add a missing import statement so that you don't have...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I did a bit of debugging and figured out that, at least in my case, imports for
ququmber-ui
(the local package) are being skipped becauseququmber-ui
is considered external andpathGroupsExcludedImportTypes
defaults to["builtin", "external"]
.My fix
"pathGroupsExcludedImportTypes": []
Hope this helps you @jens-duttke.I don’t import/require npm packages starting with an
@
, so there is no collision. Beside that, I’ve just tested to replace@
by~
(which is not a valid character in npm package names), but the exact same problem still occurs: