fix: decouple core from lowlight to reduce bundle size

packages/core/package.json

@@ -53,12 +53,18 @@
     "diff parse"
   ],
   "dependencies": {
-    "@git-diff-view/lowlight": "^0.1.2",
-    "highlight.js": "^11.11.0",
-    "lowlight": "^3.3.0",
     "fast-diff": "^1.3.0"
   },
+  "peerDependencies": {
+    "@git-diff-view/lowlight": ">=0.1.2"
+  },
+  "peerDependenciesMeta": {
+    "@git-diff-view/lowlight": {
+      "optional": true
+    }
+  },
   "devDependencies": {
+    "@git-diff-view/lowlight": "^0.1.2",
     "@types/hast": "^3.0.0"
   }
 }

packages/core/src/file.ts

@@ -1,10 +1,20 @@
-import { highlighter } from "@git-diff-view/lowlight";
-
 import { Cache } from "./cache";
 import { getPlainLineTemplate, getSyntaxLineTemplate, processTransformForFile } from "./parse";
 
 import type { DiffAST, DiffHighlighter, DiffHighlighterLang, SyntaxLine } from "@git-diff-view/lowlight";
 
+let _defaultHighlighter: Omit<DiffHighlighter, "getHighlighterEngine"> | null = null;
+
+/**
+ * Register a default highlighter to use when no `registerHighlighter` is
+ * provided to `DiffView`. This is called automatically by
+ * `@git-diff-view/lowlight` when it is imported, so most users don't need
+ * to call this directly.
+ */
+export function setDefaultHighlighter(h: Omit<DiffHighlighter, "getHighlighterEngine">) {
+  _defaultHighlighter = h;
+}
+
 const map = new Cache<string, File>();
 
 const devKey = "@git-diff-cache";
@@ -109,7 +119,16 @@ export class File {
   }) {
     if (!this.raw) return;
 
-    const finalHighlighter = registerHighlighter || highlighter;
+    const finalHighlighter = registerHighlighter || _defaultHighlighter;
+
+    if (!finalHighlighter) {
+      if (__DEV__) {
+        console.warn(
+          "[@git-diff-view/core] No syntax highlighter available. Import @git-diff-view/lowlight or provide a registerHighlighter."
+        );
+      }
+      return;
+    }
 
     if (this.rawLength > finalHighlighter.maxLineToIgnoreSyntax) {
       if (__DEV__) {
@@ -121,15 +140,15 @@ export class File {
     }
 
     // check current lang is support or not
-    // if it's a unsupported lang, fallback to use lowlightHighlighter
+    // if it's a unsupported lang, fallback to use the default highlighter
     let supportEngin = finalHighlighter;
 
     try {
       if (!finalHighlighter.hasRegisteredCurrentLang(this.lang)) {
-        supportEngin = highlighter;
+        supportEngin = _defaultHighlighter || finalHighlighter;
       }
     } catch {
-      supportEngin = highlighter;
+      supportEngin = _defaultHighlighter || finalHighlighter;
     }
 
     if (

packages/core/src/index.ts

@@ -5,6 +5,9 @@ export * from "./diff-file";
 export * from "./escape-html";
 export * from "./diff-file-utils";
 
-export * from "@git-diff-view/lowlight";
+// Re-export only types from @git-diff-view/lowlight to avoid bundling
+// all highlight.js languages. Users who want the built-in lowlight
+// highlighter should import it from @git-diff-view/lowlight directly.
+export type { DiffHighlighter, DiffHighlighterLang, DiffAST, SyntaxLine, SyntaxNode } from "@git-diff-view/lowlight";
 
 export const versions = __VERSION__;

packages/lowlight/package.json

@@ -56,5 +56,8 @@
     "@types/hast": "^3.0.0",
     "highlight.js": "^11.11.0",
     "lowlight": "^3.3.0"
+  },
+  "peerDependencies": {
+    "@git-diff-view/core": ">=0.0.1"
   }
 }

packages/lowlight/src/index.ts

@@ -1,4 +1,5 @@
 import { processAST } from "@git-diff-view/utils";
+import { setDefaultHighlighter } from "@git-diff-view/core";
 import { createLowlight, all } from "lowlight";
 
 import type { _getAST } from "./lang";
@@ -151,4 +152,8 @@ export const versions = __VERSION__;
 
 export const highlighter: DiffHighlighter = instance as DiffHighlighter;
 
+// Auto-register as the default highlighter in @git-diff-view/core
+// so that syntax highlighting works out of the box when this package is imported.
+setDefaultHighlighter(highlighter);
+
 export * from "./lang";

packages/react/src/components/DiffView.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-unnecessary-type-constraint */
 /* eslint-disable @typescript-eslint/ban-ts-comment */
-import { DiffFile, _cacheMap, SplitSide, highlighter as buildInHighlighter } from "@git-diff-view/core";
+import { DiffFile, _cacheMap, SplitSide } from "@git-diff-view/core";
 import { diffFontSizeName, DiffModeEnum } from "@git-diff-view/utils";
 import { memo, useEffect, useMemo, forwardRef, useImperativeHandle, useRef } from "react";
 import * as React from "react";
@@ -315,22 +315,23 @@ const DiffViewWithRef = <T extends unknown>(
     if (!diffFile) return;
 
     if (props.diffViewHighlight) {
+      // Always call initSyntax when highlight is enabled.
+      // initSyntax() is idempotent — when syntax is already initialized with a
+      // matching highlighter, it efficiently re-syncs syntax line references
+      // from the underlying File objects without recomputing.
+      //
+      // Previously, this effect skipped initSyntax() when the highlighter
+      // name/type already matched. However, on remount the global File cache
+      // causes initRaw() → #syncSyntax() to copy highlighter metadata from
+      // cached File objects into the fresh DiffFile, making it appear that
+      // syntax was already set up when it wasn't. This left syntax lines null
+      // and highlighting was lost on subsequent renders.
       if (registerHighlighter) {
-        if (
-          registerHighlighter.name !== diffFile._getHighlighterName() ||
-          registerHighlighter.type !== diffFile._getHighlighterType() ||
-          registerHighlighter.type !== "class"
-        ) {
-          diffFile.initSyntax({ registerHighlighter: registerHighlighter });
-          diffFile.notifyAll();
-        }
-      } else if (
-        (!diffFile._getIsCloned() && diffFile._getHighlighterName() !== buildInHighlighter.name) ||
-        diffFile._getHighlighterType() !== "class"
-      ) {
+        diffFile.initSyntax({ registerHighlighter: registerHighlighter });
+      } else {
         diffFile.initSyntax();
-        diffFile.notifyAll();
       }
+      diffFile.notifyAll();
     }
   }, [diffFile, props.diffViewHighlight, registerHighlighter, diffViewTheme]);
 

packages/solid/src/components/DiffView.tsx

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-unnecessary-type-constraint */
-import { _cacheMap, DiffFile, SplitSide, highlighter as buildInHighlighter } from "@git-diff-view/core";
+import { _cacheMap, DiffFile, SplitSide } from "@git-diff-view/core";
 import { diffFontSizeName, DiffModeEnum } from "@git-diff-view/utils";
 import { type JSXElement, type JSX, createSignal, createEffect, createMemo, onCleanup, Show } from "solid-js";
 
@@ -198,21 +198,11 @@ const InternalDiffView = <T extends unknown>(props: DiffViewProps<T>) => {
       if (props.diffViewHighlight) {
         const registerHighlighter = props.registerHighlighter;
         if (registerHighlighter) {
-          if (
-            registerHighlighter.name !== currentDiffFile._getHighlighterName() ||
-            registerHighlighter.type !== currentDiffFile._getHighlighterType() ||
-            registerHighlighter.type !== "class"
-          ) {
-            currentDiffFile.initSyntax({ registerHighlighter: registerHighlighter });
-            currentDiffFile.notifyAll();
-          }
-        } else if (
-          (!currentDiffFile._getIsCloned() && currentDiffFile._getHighlighterName() !== buildInHighlighter.name) ||
-          currentDiffFile._getHighlighterType() !== "class"
-        ) {
+          currentDiffFile.initSyntax({ registerHighlighter: registerHighlighter });
+        } else {
           currentDiffFile.initSyntax();
-          currentDiffFile.notifyAll();
         }
+        currentDiffFile.notifyAll();
       }
     }
   };

packages/svelte/src/lib/components/DiffView.svelte

@@ -4,8 +4,7 @@
 	import {
 		DiffFile,
 		type DiffHighlighter,
-		SplitSide,
-		highlighter as buildInHighlighter
+		SplitSide
 	} from '@git-diff-view/core';
 	import { onDestroy, type Snippet } from 'svelte';
 	import { useIsMounted } from '$lib/hooks/useIsMounted.svelte.js';
@@ -164,23 +163,13 @@
 		if (enableHighlight) {
 			const registerHighlighter = props.registerHighlighter;
 			if (registerHighlighter) {
-				if (
-					registerHighlighter.name !== diffFile._getHighlighterName() ||
-					registerHighlighter.type !== diffFile._getHighlighterType() ||
-					registerHighlighter.type !== 'class'
-				) {
-					diffFile.initSyntax({
-						registerHighlighter: registerHighlighter
-					});
-					diffFile.notifyAll();
-				}
-			} else if (
-				(!diffFile._getIsCloned() && diffFile._getHighlighterName() !== buildInHighlighter.name) ||
-				diffFile._getHighlighterType() !== 'class'
-			) {
+				diffFile.initSyntax({
+					registerHighlighter: registerHighlighter
+				});
+			} else {
 				diffFile.initSyntax();
-				diffFile.notifyAll();
 			}
+			diffFile.notifyAll();
 		}
 	};
 

packages/vue/src/components/DiffView.tsx

@@ -1,4 +1,4 @@
-import { DiffFile, _cacheMap, SplitSide, highlighter as buildInHighlighter } from "@git-diff-view/core";
+import { DiffFile, _cacheMap, SplitSide } from "@git-diff-view/core";
 import { diffFontSizeName, DiffModeEnum } from "@git-diff-view/utils";
 import { defineComponent, provide, ref, watch, watchEffect, computed, onUnmounted } from "vue";
 
@@ -165,23 +165,13 @@ export const DiffView = defineComponent<
       if (enableHighlight.value) {
         const registerHighlighter = props.registerHighlighter;
         if (registerHighlighter) {
-          if (
-            registerHighlighter.name !== instance._getHighlighterName() ||
-            registerHighlighter.type !== instance._getHighlighterType() ||
-            registerHighlighter.type !== "class"
-          ) {
-            instance.initSyntax({
-              registerHighlighter: registerHighlighter,
-            });
-            instance.notifyAll();
-          }
-        } else if (
-          (!instance._getIsCloned() && instance._getHighlighterName() !== buildInHighlighter.name) ||
-          instance._getHighlighterType() !== "class"
-        ) {
+          instance.initSyntax({
+            registerHighlighter: registerHighlighter,
+          });
+        } else {
           instance.initSyntax({});
-          instance.notifyAll();
         }
+        instance.notifyAll();
       }
     };