This is what one of my import paths look like:
import Register from "../../../../../../../../src/components/register/Register";
How can I specify paths relative to the root of the project folder?
CodePudding user response:
Module builder configuration specifies it.
For e.g. Webpack 2:
module.exports = {
...
resolve: {
modules: [
'node_modules',
path.resolve(__dirname '/src')
],
alias: {
src: path.resolve(__dirname '/src')
}
},
...}
Then you can import like this:
import Register from "src/components/register/Register";
CodePudding user response:
If you're using a webpack configuration file, you can add the following to create absolute paths:
module.exports = {
//...
resolve: {
alias: {
Components: path.resolve(__dirname, 'src/components/')
}
}
};
Now instead of ../../../../../../../../src/components/register/Register
you can do Components/register/Register
.
If you don't have a webpack configuration file, like in the case of react-create-app
, and you don't wanna touch the webpack configuration file in your node_modules
, you might wanna have a look at customize-cra
& react-app-rewired