Attempted import error: 'react' does not contain a default export (imported as 'require$$0__default').

[MithileshD]

Please provide an explanation of the issue

While creating a build of our react-application which uses react-google-maps/api using the "npm run build" command, the build creation is failing with the following error,

./node_modules/@react-google-maps/api/dist/esm.js Attempted import error: 'react' does not contain a default export (imported as 'require$$0__default').

Your Environment

os : Windows-10

node --version : 14.12

react version : 17.0.2

webpack version : 4

@babel version : 1.13.3 (babel-plugin-import)

@react-google-maps/api version : 2.12.0

How does it behave?

While creating a build of our application which uses react-google-maps/api using the "npm run build command, the build creation is failing with the following error, ./node_modules/@react-google-maps/api/dist/esm.js Attempted import error: 'react' does not contain a default export (imported as 'require$$0__default').

How should it behave correctly?

The error mentioned above should not occur and build creation should be successful.

Basic implementation of incorrect behaviour in codesandbox.com

Cannot re-produce in the sandbox as I am unable to run the command 'npm run build' in the sandbox. However this can be easily recreated on any local machine simply by following the below steps,

1. Create a react project using create-react-app
2. Add dev dependency "@react-google-maps/api"
3. run the command "npm run build"
4. build fails with the above error message

Request you to resolve this ASAP as it is blocking the application build. The solution is simple and is mentioned below for reference.

SUGGESTED WORKING SOLUTION********** Refer attached image