自定义js/css 自定义代码主题

components/ExternalScript.js

@@ -18,6 +18,9 @@ const ExternalScript = () => {
         loadExternalResource(url, 'css')
       }
     }
+    // 静态导入本地自定义样式
+    loadExternalResource('/css/custom.css', 'css')
+    loadExternalResource('/js/custom.js', 'js')
   }, [])
   return null
 }

components/NotionPage.js

@@ -26,7 +26,7 @@ const Pdf = dynamic(
 // https://github.com/txs
 // import PrismMac from '@/components/PrismMac'
 const PrismMac = dynamic(() => import('@/components/PrismMac'), {
-  ssr: false
+  ssr: true
 })
 
 const Collection = dynamic(() =>

components/PrismMac.js

@@ -10,12 +10,20 @@ import 'prismjs/plugins/line-numbers/prism-line-numbers.css'
 import 'prismjs/plugins/autoloader/prism-autoloader'
 // mermaid图
 import BLOG from '@/blog.config'
+import { isBrowser, loadExternalResource } from '@/lib/utils'
 
 /**
  * @author https://github.com/txs/
  * @returns
  */
 const PrismMac = () => {
+  if (isBrowser()) {
+    loadExternalResource(BLOG.PRISM_THEME_PATH, 'css')
+    if (BLOG.CODE_MAC_BAR) {
+      loadExternalResource('/css/prism-mac-style.css', 'css')
+    }
+  }
+
   React.useEffect(() => {
     renderPrismMac()
     renderMermaid()