In react because I have to import varies helper or component I have this problem
import approxPerDay from '../../../utils/approxPerDay.js'
import otherstuff from '../components/otherstuff'
and in another file it might be import approxPerDay from '../utils/approxPerDay.js'
It's really hard and time consuming to find is the relative path is. Is there any npm or helper can solve this issue?
According to create-react-app Docs, We can use absolute imports in our react project by configuring a jsconfig. json / tsconfig. json (for typescript projects) file in the root of our project. If you're using TypeScript in your project, you will already have a tsconfig.
To import component outside src/ directory with React, we can declare a local dependency on package. json. { //... "dependencies": { "app-b-dashboard": "file:./packages/app-b-dashboard" //... } //... } to declare the app-b-dashboard dependency in the dependencies section of package.
Select the src folder in the project window and right-click on it. Select the option Mark Directory as and then select the Resources Root option. Now go to Settings -> Editor -> Code Style -> JavaScript and select the Imports tab. Then check the Use paths relative to the project, resource or sources roots.
I was experiencing a similar problem. I finally resolved it by following this article: https://medium.com/@ktruong008/absolute-imports-with-create-react-app-4338fbca7e3d
NODE_PATH = src/
That worked for me.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With