{"record":{"id":"e1b0f7c9e4013f8d","repo":"emotion-js/emotion","slug":"you-are-loading-emotion-react-when-it-is-already","errorCode":null,"errorMessage":"You are loading @emotion/react when it is already loaded. Running multiple instances may cause problems. This can happen if multiple versions are used, or if multiple builds of the same version are used.","messagePattern":"You are loading @emotion/react when it is already loaded\\. Running multiple instances may cause problems\\. This can happen if multiple versions are used, or if multiple builds of the same version are used\\.","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"packages/react/src/index.ts","lineNumber":54,"sourceCode":"declare const jest: unknown\ndeclare const vi: unknown\n\nif (isDevelopment) {\n  const isBrowser = typeof document !== 'undefined'\n  // #1727, #2905 for some reason Jest and Vitest evaluate modules twice if some consuming module gets mocked\n  const isTestEnv = typeof jest !== 'undefined' || typeof vi !== 'undefined'\n\n  if (isBrowser && !isTestEnv) {\n    // globalThis has wide browser support - https://caniuse.com/?search=globalThis, Node.js 12 and later\n    const globalContext: Record<string, unknown> =\n      typeof globalThis !== 'undefined'\n        ? globalThis // eslint-disable-line no-undef\n        : isBrowser\n          ? window\n          : global\n    const globalKey = `__EMOTION_REACT_${pkg.version.split('.')[0]}__`\n    if (globalContext[globalKey]) {\n      console.warn(\n        'You are loading @emotion/react when it is already loaded. Running ' +\n          'multiple instances may cause problems. This can happen if multiple ' +\n          'versions are used, or if multiple builds of the same version are ' +\n          'used.'\n      )\n    }\n    globalContext[globalKey] = true\n  }\n}\n","sourceCodeStart":36,"sourceCodeEnd":64,"githubUrl":"https://github.com/emotion-js/emotion/blob/b882bcba85132554992e4bd49e94c95939bbf810/packages/react/src/index.ts#L36-L64","documentation":"When @emotion/react loads, it sets a flag __EMOTION_REACT_<major>__ on the global object. If that flag already exists, a second copy of the library (same major version) is being loaded, and emotion warns that multiple instances can break context sharing, caches, and hashing. This is a console.warn, not a throw, but it signals real duplication.","triggerScenarios":"Bundling two copies of @emotion/react (e.g. one from your app, one from a dependency's node_modules due to mismatched semver ranges); loading both an ESM and CJS build; mixing a bundled copy with a CDN/UMD copy on the same page.","commonSituations":"Dependency A requires ^11.x and B requires ^11.y resolving to two installed versions; monorepo where a package bundles its own emotion instead of listing it as a peer dependency; SSR + client hydration loading different builds.","solutions":["Run npm ls @emotion/react (or yarn why) to find duplicate copies in node_modules","Add dedupe / overrides in the package manager (npm dedupe, yarn resolutions, pnpm overrides) to force a single version","Ensure dependencies list @emotion/react as a peerDependency instead of bundling it","Check the bundler config for accidental dual ESM/CJS entry inclusion and alias @emotion/react to one copy"],"exampleFix":"// before (package.json)\n\"dependencies\": { \"@emotion/react\": \"^11.11.0\" }\n// after (package.json, forcing one copy)\n\"overrides\": { \"@emotion/react\": \"^11.11.0\" }","handlingStrategy":"validation","validationCode":"const key = `__EMOTION_REACT_${pkg.version.split('.')[0]}__`\nif (globalThis[key]) console.warn('Duplicate @emotion/react detected before render')","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Run npm ls @emotion/react in CI to detect duplicate copies","Use peerDependencies for emotion in shared libraries and dedupe in the app","Avoid mixing bundled and CDN/UMD copies of @emotion/react on the same page","Pin a single emotion major version via package manager overrides/resolutions"],"tags":["duplicate-module","react","bundling","dependency-conflict"],"backgroundTag":"duplicate-library-instance","analyzedSha":"b882bcba85132554992e4bd49e94c95939bbf810","analyzedAt":"2026-09-02T22:27:13.739Z","contentChangedAt":null,"schemaVersion":2},"datasetVersion":"2026-09-10T02:17:09.455Z"}