diff --git a/.changeset/sour-poets-move.md b/.changeset/sour-poets-move.md new file mode 100644 index 000000000..e11178983 --- /dev/null +++ b/.changeset/sour-poets-move.md @@ -0,0 +1,5 @@ +--- +'@emotion/core': patch +--- + +Warn if @emotion/core is initialized more than once in the same development environment. diff --git a/packages/core/src/index.js b/packages/core/src/index.js index 820125be7..977a89cf5 100644 --- a/packages/core/src/index.js +++ b/packages/core/src/index.js @@ -6,3 +6,18 @@ export { keyframes } from './keyframes' export { ClassNames } from './class-names' export { ThemeContext, useTheme, ThemeProvider, withTheme } from './theming' export { default as css } from './css' + +if (process.env.NODE_ENV !== 'production') { + const isBrowser = typeof document !== 'undefined' + const globalKey = '__EMOTION_CORE__' + const globalContext = isBrowser ? window : global + if (globalContext[globalKey]) { + console.warn( + 'You are loading @emotion/core 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.' + ) + } + globalContext[globalKey] = true +} diff --git a/packages/utils/src/index.js b/packages/utils/src/index.js index 2347bbd33..62a86f817 100644 --- a/packages/utils/src/index.js +++ b/packages/utils/src/index.js @@ -1,7 +1,7 @@ // @flow import type { RegisteredCache, EmotionCache, SerializedStyles } from './types' -let isBrowser = typeof document !== 'undefined' +const isBrowser = typeof document !== 'undefined' export function getRegisteredStyles( registered: RegisteredCache,