Can't resolve absolute imports (with TypeScript)

Expo SDK
1

Hello,

I’ve setup a basic Expo project with TypeScript and wanted to use absolute imports inside my src folder.
This would allow me to import Home directly rather than src/Home.

Normally, with TypeScript, I’d only have to change the baseUrl option in the tsconfig.json file, but it seems that Expo/Babel doesn’t take that into account. So I opened my babel config file (babel.config.ts) and tried adding a root property like so

module.exports = (api: any) => {
  api.cache(true);
  return {
    plugins: [
      [
        'babel-plugin-module-resolver',
        {
          root: './src',
        },
      ],
    ],
    presets: ['babel-preset-expo'],
  };
};

But Expo/Babel still fails to resolve my imports. I’ve seen a couple of posts (1, 2) with people that had a similar issue but it seems that they all had to resort to using the alias option which isn’t optimal. I tried using alias and that did not work for me.

For now, I’ve resorted to creating a package.json file in the “src” folder and added {"name": "src"} so that the module src resolves to that folder. But TypeScript also needed an alias of its own in the paths section of the tsconfig.json. This is a really hackish way to do it :confounded:

So I guess my question is, is there a way to “fix” this issue and allow for absolute imports/path? (And ideally, make it work cleanly with TypeScript’s imports?)

Thank you

3 Likes
2

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.