diff --git a/src/drafts/MarkdownEditor/_FormattingTools.tsx b/src/drafts/MarkdownEditor/_FormattingTools.tsx
index 07f0722c366..4d610565d78 100644
--- a/src/drafts/MarkdownEditor/_FormattingTools.tsx
+++ b/src/drafts/MarkdownEditor/_FormattingTools.tsx
@@ -1,5 +1,4 @@
-import React, {forwardRef, useImperativeHandle, useRef} from 'react'
-import '@github/markdown-toolbar-element'
+import React, {forwardRef, useImperativeHandle, useRef, useEffect} from 'react'
 
 export type FormattingTools = {
   header: () => void
@@ -49,6 +48,10 @@ export const FormattingTools = forwardRef<FormattingTools, {forInputId: string}>
     reference: () => referenceRef.current?.click()
   }))
 
+  useEffect(() => {
+    require('@github/markdown-toolbar-element')
+  }, [])
+
   return (
     <markdown-toolbar for={forInputId} style={{display: 'none'}}>
       <md-header ref={headerRef} />