diff --git a/sites/shared/components/wrappers/mdx.js b/sites/shared/components/wrappers/mdx.js
index b5670a1d0b0..1c1ab3a64db 100644
--- a/sites/shared/components/wrappers/mdx.js
+++ b/sites/shared/components/wrappers/mdx.js
@@ -21,9 +21,12 @@ const MdxWrapper = ({ mdx, app, t, components = {} }) => {
   const [mdxModule, setMdxModule] = useState()
 
   useEffect(() => {
-    ;(async () => {
+    // This is a workaround to keep prettier and eslint
+    // from fighting over syntax
+    async function prettierEslintPeaceDeal() {
       setMdxModule(await run(mdx, runtime))
-    })()
+    }
+    prettierEslintPeaceDeal()
   }, [mdx])
 
   /*
diff --git a/sites/shared/components/wrappers/toc.js b/sites/shared/components/wrappers/toc.js
index 39dfe874577..4fa9918875d 100644
--- a/sites/shared/components/wrappers/toc.js
+++ b/sites/shared/components/wrappers/toc.js
@@ -13,9 +13,12 @@ const TocWrapper = ({ toc }) => {
   const [mdxModule, setMdxModule] = useState()
 
   useEffect(() => {
-    ;(async () => {
+    // This is a workaround to keep prettier and eslint
+    // from fighting over syntax
+    async function prettierEslintPeaceDeal() {
       setMdxModule(await run(toc, runtime))
-    })()
+    }
+    prettierEslintPeaceDeal()
   }, [toc])
 
   // React component for MDX content