Resolving Absolute Import Conflicts

Question

Say I have a local file called "util.ts". With absolute imports enabled, I'm able to call everywhere in my app.

import * as util from 'util'

Now say theres a package named util in node_modules. That will be imported instead. Is there anyway to specify that I explicitly want my module rather than the one in node modules?

Answer 1

reference: https://github.com/facebook/create-react-app/issues/7795

Try

{
  "compilerOptions":  {
    ...    
    "baseUrl": "."
  }
}

and prefix your imports with "src/", as in "src/util".

I encountered the exact some problem with wanting to use a file in my src directory named 'util.ts'. However, it turns out that node modules always win in cases of a name collision. The github issue link above references one possible solution, change your tsconfig baseUrl to '.' and for your absolute imports, prefix them with 'src', so 'src/util'.

I suspect you can use tsconfig 'paths' to alias things or avoid having to type src in other instances, but I haven't explored that route much as I actually am ok with prefixing my absolute imports with 'src'.

Paths reference: https://www.typescriptlang.org/tsconfig#paths