Allow Typescript absolute path alias

Hey, currently the absolute paths from my typescript tsconfig.json are not resolved.

{
  "compilerOptions": {
    "paths": {
      "@svgs/*": [
        "svgs/*"
      ]
  }
}

Doing import Dog from '@svgs/dog.svg' results in an error: Cannot find module '@svgs/dog.svg' from '/Users/lukasoppermann/Repos/next-app/components'

Is there a way to make this work?

[lukasoppermann]

It seems to be working fine just by installing the babel module-resolver and adding the following to the .babelrc and leaving the tsconfig.json as is.

// babelrc
{
  "presets": ["next/babel"],
  "plugins": [
    "inline-react-svg",
    ["module-resolver", {
      "root": ["./"],
      "alias": {
        "@svgs": "./svgs"
      }
    }]
  ]
}
///

[ljharb]

Good call; as long as you’re OK duplicating the config in both babel and TS configs, that should work fine.