0

I get this error after installing and importing framer-motion in the middle of my project

Can't import the named export 'Children' from non EcmaScript module (only default export is available)

I have tried to install after npx create-react-app and it works fine. This only happened if I install the package in the middle. This is my project

Bonnary Vet
  • 1
  • 1
  • 1
    Does this answer your question? [Error importing Framer Motion v5 in React (with create-react-app)](https://stackoverflow.com/questions/69769360/error-importing-framer-motion-v5-in-react-with-create-react-app) – Cadin Nov 11 '21 at 17:13

1 Answers1

2

First, install the react-app-rewired NPM package as a dev dependency.

Then, in package.json, update the start, build, and test scripts to replace react-scripts with react-app-rewired:

"scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-scripts eject"
},

Finally, paste this into a file in the project root directory named config-overrides.js:

module.exports = function override(webpackConfig) {
  webpackConfig.module.rules.push({
    test: /\.mjs$/,
    include: /node_modules/,
    type: "javascript/auto"
  });

  return webpackConfig;
}

Now npm start / yarn start should work.

Valeria Kirzhner
  • 21
  • 2