import createCache from '@emotion/cache'; const isBrowser = typeof document !== 'undefined'; // On the client side, Create a meta tag at the top of the and set it as insertionPoint. // This assures that MUI styles are loaded first. // It allows developers to easily override MUI styles with other styling solutions, like CSS modules. export default function createEmotionCache() { let insertionPoint; if (isBrowser) { const emotionInsertionPoint = document.querySelector( 'meta[name="emotion-insertion-point"]' ); insertionPoint = emotionInsertionPoint ?? undefined; } return createCache({ key: 'mui-style', insertionPoint }); }