How to enable absolute imports in Create React App v4

Admin 1
Viewed 188

I've recently updated CRA to v4 and now webpack doesn't recognize absolute imports. This error appears:

TypeError: store__WEBPACK_IMPORTED_MODULE_1__.default.model is not a function

import looks like this:

import store from 'store';

and it imports store from src folder

My jsconfig.json looks like this:

{
  "compilerOptions": {
    "baseUrl": "./src"
  }
}

With CRA v3 it works perfectly fine. How can I make this work without ejecting?

create-react-app webpack reactjs
1 Answers

The first step is done already which is having to create a JavaScript configuration file named jsconfig.json or TypeScript Configuration file named tsconfig.json in the root directory of your project, in the use-case of TypeScript it is automatically created from the start.

In your jsconfig.json replace what you have with this to include src:

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