multiple resolvers don't always work

[benmosher]

Need to isolate a repro but in my day job codebase the following works:

settings:
  import/resolver:
    webpack: {}
    typescript: {}

and this doesn't (always), but should (always):

settings:
  import/resolver: ['webpack', 'typescript']

technically blocked by import-js/eslint-import-resolver-typescript#18 for typescript resolver specifically but there is something else going on that makes

settings:
  import/resolver: webpack

work, but

settings:
  import/resolver: ['webpack', { 'typescript': {} }]

doesn't always. not sure what the difference is but in some files I get "Resolver error" with the above.

[teoxoy]

I don't think those 2 resolvers are compatible with each other.
You don't need the typescript resolver if you already use the webpack one.
If you want aliases, set them up in the webpack config (alias option) instead of declaring them via compilerOptions.paths in your tsconfig

[smtchahal]

I realize this is an old thread, but I came across a similar issue where I would ideally want both of these resolvers.

I need the webpack resolver so that it can resolve the resolve.aliases from webpack.config.js properly, but I need the typescript resolver because I want to be able to import App from 'App' from a file named App.tsx.

There currently seems to be no way to have both of these functionalities using just one of these resolvers.

[ljharb]

@smtchahal my personal opinion is that the proper way to solve this is to use babel for all transpiling (it does a much better job than tsc), and to handle aliases using a babel transform.

Short of that, I think you'd need a webpack config that did nothing but resolve the aliases, and then fell back to the TS resolver - or, you'd need to also define the aliases in tsconfig.

[JounQin]

I believe this can be closed for a long time because import-js/eslint-import-resolver-typescript#18 has already been merged.