tolotra
tolotra

Reputation: 3270

How to avoid very long paths and use absolute paths within a Create React App project?

Is there a babel plugin to avoid long import path in CRA? I've searching a lot on the web but I can't find the best way to achieve this.

Actual:

import MyComponent from '../../../../components/MyComponent'

Expected

import MyComponent from 'components/MyComponent'

Upvotes: 10

Views: 1298

Answers (1)

kind user
kind user

Reputation: 41913

In your main root, create file jsconfig.json:

{
   "compilerOptions": {
      "baseUrl": "src"
   },
   "include": ["src"]
}

Where src is the folder where you store your project files, sometimes it may be /app or /src.

Then you will be able to import your components with an absolute path:

import MyComponent from 'components/MyComponent';

Upvotes: 12

Related Questions