Backstory:
I am gradually converting an existing React Native project to TypeScript. Absolute paths have been working for years based on my babelrc
configuration.
Problem:
Since adding TypeScript, absolute paths work only in the following scenarios:
- importing
js
files into otherjs
files - importing
ts
files intojs
files - importing
js
files intots
files
The thing that does not work is:
- importing
ts
files into otherts
files
It appears to work in VSCode but when I try to build my app, I get the infamous:
{insert file here} could not be found within the project or in these directories: node_modules, etc.
I have spent weeks trying to figure this out. Absolute paths with TypeScript seems to be a challenge a lot of people run into. I've tinkered with my babelrc
, tsconfig
, eslintrc
, and metro.config.js
with a myriad of combinations and additions/subtractions. I've installed dependencies, I've tried everything the error suggests(deleting caches, restarting, etc.). I've played with the import statements and scoured the docs until I was black and blue, reinstalled node_modules
and pods
.
The ONLY thing that has worked(besides relative imports, but ew) is adding a package.json
to the folder I am trying to import from like so:
{"name": "app"}
This seems simple enough but I can't accept that this is the only way. And as I convert more and more files, I don't really want to have to keep sprinkling package.json
s everywhere like some overworked typescript fairy :)
I don't want to make this too long so if anyone thinks it would be beneficial to see my config files, I can for sure add them. Especially hoping for an answer referenced by official sources. Super appreciate anyone's help!