`Cannot set properties of undefined` Type Error for React Moment package

Describe the bug

I’m migrating one of our projects at my company to Vite from CRA, and I see the following error in the console when I navigate to the locally hosted application in my browser:

See also the log file: localhost-1647615535049.log

Needless to say, this wasn’t an issue when we were using CRA.

I’ve tried a number of work arounds myself, but to no avail.

Happy to share if they’re of interest.

Would love to find a fix for this as CRA is painfully slow for running a local development environment and building our project for production.

Thank you!

Reproduction

https://stackblitz.com/edit/vitejs-vite-vvkwaa

System Info

System:
    OS: macOS Mojave 10.14.6
    CPU: (8) x64 Intel(R) Core(TM) i7-4770HQ CPU @ 2.20GHz
    Memory: 1.05 GB / 16.00 GB
    Shell: 5.3 - /bin/zsh
  Binaries:
    Node: 16.2.0 - ~/.nvm/versions/node/v16.2.0/bin/node
    Yarn: 1.22.17 - ~/.nvm/versions/node/v16.2.0/bin/yarn
    npm: 7.13.0 - ~/.nvm/versions/node/v16.2.0/bin/npm
  Browsers:
    Brave Browser: 99.1.36.112
    Chrome: 99.0.4844.74
    Firefox: 94.0.2
    Firefox Developer Edition: 98.0
    Safari: 14.1.2
  npmPackages:
    @vitejs/plugin-react: ^1.2.0 => 1.2.0 
    vite: ^2.8.6 => 2.8.6

Used Package Manager

npm

Logs

N/A (no errors when running vite or vite build)

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn’t already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it’s a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[iknowhtml]

Can confirm that the above work around resolves the issue: https://stackblitz.com/edit/vitejs-vite-3kngck?file=vite.config.js

Thanks @sapphi-red!

[sapphi-red]

This issue is simillar to #7053.

• react-moment(cjs) is importing moment by import (which is transpiled to require) here.
• moment is resolved to moment/dist/moment.js(esm) by jsnext:main field.

After prebundle, module.exports = { default: Moment } but react-moment expects it to be module.exports = Moment so the error occurs.