Identifier 'React' has already been declared error when building npm package with nx:rollu

[pavinduLakshan]

🐛 Bug Report

Our project has a directory of svg icons in modules/react-components/src/assets/images which is being used by other ts files in the same module as follows.

modules/react-components/src/components/alert/alert.tsx

import ErrorIcon from "../../assets/images/error-icon.svg";
import InfoIcon from "../../assets/images/info-icon.svg";
import SuccessIcon from "../../assets/images/success-icon.svg";
import WarningIcon from "../../assets/images/warning-icon.svg";

The error thrown during the build is related to bundling these icons. I have added the error stack trace and the configs we use at https://stackoverflow.com/questions/76544765/identifier-react-has-already-been-declared-when-building-npm-package-with-nxr/76545003.

To Reproduce

1. Clone the reproducible sample https://github.com/pavinduLakshan/nx-svg-issue-repro.
2. Run pnpm install in the project root.
3. Run pnpm build from the project root.
4. You will see the build error printed in the terminal.

Expected behavior

The module should be built without any errors.

Link to repl or repo (highly encouraged)

https://github.com/pavinduLakshan/nx-svg-issue-repro

Run npx envinfo --system --binaries --npmPackages @svgr/core,@svgr/cli,@svgr/webpack,@svgr/rollup --markdown --clipboard

Paste the results here:

Command provided is not working

/var/folders/6t/7q1m7tt55wl6vxyl6_3q64v00000gn/T/npx-9666739a.sh: line 1: envinfo: command not found