revert: "chore(md-enhance): remove compact with Mermaid", close #3874

This reverts commit ea91488.
vuepress-theme-hope · Jan 31, 2024 · 2f51907 · 2f51907
1 parent 0f475dd
commit 2f51907
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 1 deletion.
diff --git a/packages/md-enhance/rollup.config.ts b/packages/md-enhance/rollup.config.ts
@@ -33,6 +33,7 @@ export default [
 
     {
       external: [
+        "@mermaid",
         "@vue/repl",
         "@vue/repl/codemirror-editor",
         "balloon-css/balloon.css",

diff --git a/packages/md-enhance/src/client/components/Mermaid.ts b/packages/md-enhance/src/client/components/Mermaid.ts
@@ -113,7 +113,7 @@ export default defineComponent({
 
     const renderMermaid = async (): Promise<void> => {
       const [{ default: mermaid }] = await Promise.all([
-        import(/* webpackChunkName: "mermaid" */ "mermaid"),
+        import(/* webpackChunkName: "mermaid" */ "@mermaid"),
         loaded
           ? Promise.resolve()
           : ((loaded = true),

diff --git a/packages/md-enhance/src/node/plugin.ts b/packages/md-enhance/src/node/plugin.ts
@@ -26,8 +26,11 @@ import {
   addViteSsrExternal,
   addViteSsrNoExternal,
   chainWebpack,
+  detectPackageManager,
+  getBundlerName,
   getLocales,
   isPlainObject,
+  noopModule,
 } from "vuepress-shared/node";
 
 import {
@@ -206,6 +209,17 @@ export const mdEnhancePlugin =
         },
       }),
 
+      alias: (app): Record<string, string> => ({
+        // we can not let vite force optimize deps with pnpm, so we use a full bundle in devServer here
+        "@mermaid": status.mermaid
+          ? app.env.isDev &&
+            detectPackageManager() === "pnpm" &&
+            getBundlerName(app) === "vite"
+            ? "mermaid/dist/mermaid.esm.min.mjs"
+            : "mermaid"
+          : noopModule,
+      }),
+
       extendsBundlerOptions: (bundlerOptions: unknown, app): void => {
         addViteSsrNoExternal(bundlerOptions, app, [
           "fflate",

diff --git a/packages/md-enhance/src/shims-mermaid.d.ts b/packages/md-enhance/src/shims-mermaid.d.ts
@@ -0,0 +1,5 @@
+declare module "@mermaid" {
+  import Mermaid from "mermaid";
+
+  export default Mermaid;
+}