React-Bootstrap Error in Vite: "Cannot read properties of undefined (reading 'createContext')"

Question

I'm working on a React project using Vite and React-Bootstrap, but I keep encountering the following error when running the app:

react-bootstrap.js:1415 Uncaught TypeError: Cannot read properties of undefined (reading 'createContext')
    at react-bootstrap.js:1415:97
    at react-bootstrap.js:16925:3
    at react-bootstrap.js:16928:12
    at webpackUniversalModuleDefinition (react-bootstrap.js:9:28)
    at react-bootstrap.js:10:3

Additionally, I see this error in the console:

[vite] (client) Failed to load source map for C:/.../Assignments/Full-Stack/client/node_modules/react-bootstrap/dist/react-bootstrap.js.
Error: An error occurred while trying to read the map file at module.js.map
Error: ENOENT: no such file or directory, open 'C:/.../Assignments/Full-Stack/client/node_modules/react-bootstrap/dist/module.js.map'

Relevant Versions: [email protected] [email protected] [email protected] [email protected] @vitejs/[email protected]

This does not affect the running of the project. Everything works as expected. It's just that this error keeps appearing. What could be causing this issue?

I've tried:

1. Reinstall dependencies.
2. Ensure I'm using the correct version of React and React-Bootstrap.
3. Import components in both ways:

import { Container } from "react-bootstrap";

import Container from "react-bootstrap/Container";

4. Adding optimizeDeps:{include: ["react-bootstrap"]} and build:{sourcemap: false} to vite.config.js.