DEV Community

Cover image for Absolute imports in Create React App

Absolute imports in Create React App

Michał Bednarz on January 21, 2020

One of the things that held me back from Create React App was the lack of absolute imports. I loved them so much in my custom webpack config that I...
Collapse
 
dorklord23 profile image
Tri R.A. Wibowo

Weird. This doesn't work for me :/

Collapse
 
winkee01 profile image
winkee01

try restart react app?

Collapse
 
dorklord23 profile image
Tri R.A. Wibowo

it turned out I need to set "baseUrl": "./src" instead of "baseUrl": "src" in my case.

Collapse
 
mr_frontend profile image
Michał Bednarz

What's the error? Is it during bundling or in runtime?

Collapse
 
dorklord23 profile image
Tri R.A. Wibowo • Edited

No error log per se but the absolute import just didn't work so I need to resort to set NODE_PATH='src/' in .env to make it work which is already deprecated.

Collapse
 
uahmadsoft profile image
UAhmadSoft

I tried this , It worked ......But when I tried to deploy my app on netlify , It failed on Build process with error
Cannot find module: 'components/Footer'. Make sure this package is installed.

How to use fix this on netlify ?

Collapse
 
pszndr profile image
Paulo • Edited

This is great timing, I was just looking into how to do this and a solution that I tried using an .env file was not working, and this right here did the trick. Thanks a lot!

Collapse
 
mr_frontend profile image
Michał Bednarz

Love to hear that!

Collapse
 
nafronte profile image
htmlcode

Thanks a lot! Have you any tips in case if I want organize paths for styles structure? What should I do with imports in scss files?

Collapse
 
enzo profile image
Enzo

Awful solution by the React team. What if I have a dir called lodash. How do I know if is importing the npm package or my dir?

Collapse
 
nstanard profile image
Neal Stanard

In that case you would do "baseUrl": "./", and import from your dir using src/lodash

Collapse
 
ruanengelbrecht profile image
Ruan Engelbrecht

Legend!

Collapse
 
matias_hevich profile image
Matias Hevich

THANKS A LOT!

Collapse
 
tyroneweb profile image
薛清扬

nice! it's work

Collapse
 
imvsnu profile image
imvsnu

Thanks a lot.

Collapse
 
satishgupta9794 profile image
Satish gupta

Thank you @michal , I just looking for absolute path in app, Now its working.
at the place of "src" put "./src", in VS code. It will suggest path.

Collapse
 
rsanchezp profile image
Raúl Sánchez

🚀

Collapse
 
kouatchres profile image
KOUATCHOUA MARK

It couldn't have been this simple. Kudos Bro.

Collapse
 
drnguyen profile image
NGUYỄN ĐỊCH LONG

Thank you so much

Collapse
 
yurii_tkachyk_fe447e6d6e5 profile image
Yurii Tkachyk

If dosent work, try to install "react-scripts": "^5.0.0",

Collapse
 
afsana1313 profile image
Afsana Zaman

It worked great. Thanks.