I switched working to a new React project where all of the import paths are relative to the location of the current file. This means that it is quite common to have to navigate in folders ending up with funny imports like:
import {SigninButton} from '../../../../../buttons/SigninButton'
Would like to have a simple absolute import path, where everything starts from the top default level:
import {SigninButton} from 'src/buttons/SigninButton'
It seems that this is quite easy to make this in the create react app utility. What we need to do is to create a jsconfig.json
file in the root of the project with the following content:
{
"compilerOptions": {
"baseUrl": "src"
},
"include": ["src"]
}
In case you are using TypeScript, you will already have a tsconfig.json
file at the root of your project. You will just have to add the baseUrl
setting in compilerOptions
:
{
"compilerOptions": {
...,
"baseUrl": "src"
},
"include": [
"src"
]
}
And this is pretty much it. Now we can add components with the same import statement without having to wonder how deep in the folder structure we are in.
š Neural networks for Javascript developers
The Neural Networks for JavaScript developers book is almost ready! Learn the basics of AI with TensorFlowJs examples. Join now the presale and get a 15$ coupon off the launching price!