NODE_PATH
for avoiding ../../../
When copying out a big component with several subcomponents to a separate create-react-app
project, I found myself using tons of relative imports. Counting up & overs sucks.
To help with this, create a .env
file in the root of your create-react-app
project. Inside this file, add this line:NODE_PATH=src/
or you can do it all at once on the command line with echo 'NODE_PATH=src/' >> .env
Sidenote: the >>
operator will append to the end of the file in case you already have a .env
file with stuff in it, like if you’re using custom-react-scripts
to enable bonus features in your CRA.
So yeah, now you can go through your components and clean up all the relative imports as applicable. Remember though, depending on how things are nested it may make more sense to use a ../
instead of components/Parent/components/Child
. Use your best judgement. I trust you.
Check out my other articles, or sign up for my newsletter:
No spam. Just code stuff, unsolicited music recommendations, etc.