feat(css): 自托管 KaTeX CSS 与 woff2 字体

服务端 katex-rs 只输出 HTML span,字体/排版靠配套 CSS。从 npm 包 katex
0.16.x 的 dist/ 拷贝 katex.min.css + woff2 字体(省去 woff/ttf)到 public/katex/,
CSS 用相对 url(fonts/) 引用故两者须同级。

- libs/package.json: katex ^0.16.22 作 workspace 根 devDependency
- Makefile: 新增 katex-css target,接入 build/build-linux/dev;clean 清 public/katex
- Dioxus.toml: [web.resource]/[web.resource.dev] style 列表注册 /katex/katex.min.css
- .gitignore: public/katex 作构建产物忽略(同 highlight.css 等)

make katex-css 验证通过:23KB CSS + 20 个 woff2 字体就位。

.gitignore

@@ -8,6 +8,7 @@
 others/
 public/style.css
 public/highlight.css
+public/katex
 public/tiptap
 public/codemirror
 public/lightbox

Dioxus.toml

@@ -10,9 +10,9 @@ title = "Yggdrasil - Dioxus SSR"
 watch_path = ["src", "Cargo.toml"]
 
 [web.resource]
-style = ["/style.css", "/highlight.css", "/tiptap/editor.css", "/lightbox/lightbox.css", "/yggdrasil-core/yggdrasil-core.css", "/xterm/terminal.css"]
+style = ["/style.css", "/highlight.css", "/katex/katex.min.css", "/tiptap/editor.css", "/lightbox/lightbox.css", "/yggdrasil-core/yggdrasil-core.css", "/xterm/terminal.css"]
 script = ["/tiptap/editor.js", "/codemirror/editor.js", "/lightbox/lightbox.js", "/yggdrasil-core/yggdrasil-core.js", "/xterm/terminal.js"]
 
 [web.resource.dev]
-style = ["/style.css", "/highlight.css", "/tiptap/editor.css", "/lightbox/lightbox.css", "/yggdrasil-core/yggdrasil-core.css", "/xterm/terminal.css"]
+style = ["/style.css", "/highlight.css", "/katex/katex.min.css", "/tiptap/editor.css", "/lightbox/lightbox.css", "/yggdrasil-core/yggdrasil-core.css", "/xterm/terminal.css"]
 script = ["/tiptap/editor.js", "/codemirror/editor.js", "/lightbox/lightbox.js", "/yggdrasil-core/yggdrasil-core.js", "/xterm/terminal.js"]

Makefile

@@ -1,9 +1,10 @@
-.PHONY: dev build build-linux build-freebsd freebsd-sysroot docker docker-amd64 docker-apple docker-multiarch css css-watch clean build-libs build-editor build-codemirror build-lightbox build-core build-xterm highlight-css test doc doc-open start lint fix restore-webp
+.PHONY: dev build build-linux build-freebsd freebsd-sysroot docker docker-amd64 docker-apple docker-multiarch css css-watch clean build-libs build-editor build-codemirror build-lightbox build-core build-xterm highlight-css katex-css test doc doc-open start lint fix restore-webp
 
 build:
 	@cd libs && pnpm install --frozen-lockfile
 	@$(MAKE) build-libs
 	@$(MAKE) highlight-css
+	@$(MAKE) katex-css
 	@tailwindcss -i input.css -o public/style.css --minify
 	@$(MAKE) doc
 	@dx build --release --debug-symbols=false
@@ -13,6 +14,7 @@ build-linux:
 	@cd libs && pnpm install --frozen-lockfile
 	@$(MAKE) build-libs
 	@$(MAKE) highlight-css
+	@$(MAKE) katex-css
 	@tailwindcss -i input.css -o public/style.css --minify
 	@dx build @client --release --debug-symbols=false --wasm-js-cfg false
 	@dx build @server --release --debug-symbols=false --target x86_64-unknown-linux-musl --wasm-js-cfg false --features server
@@ -82,6 +84,17 @@ restore-webp:
 highlight-css:
 	@cargo run --bin generate_highlight_css
 
+# 把 npm 包 katex 的 dist/ 拷贝到 public/katex/（服务端 katex-rs 不打包 CSS）。
+# KaTeX 的 katex.min.css 用相对 URL 引 fonts/，故 fonts/ 必须与 CSS 同级。
+# 只拷 woff2（现代浏览器全支持，省去 woff/ttf ~70% 字体体积）。
+# katex 作为 libs/ workspace 根 devDependency，pnpm install 后在 libs/node_modules/katex/。
+katex-css:
+	@echo "Copying KaTeX CSS + woff2 fonts to public/katex/..."
+	@mkdir -p public/katex/fonts
+	@cp libs/node_modules/katex/dist/katex.min.css public/katex/katex.min.css
+	@cp libs/node_modules/katex/dist/fonts/*.woff2 public/katex/fonts/
+	@echo "KaTeX CSS ready at public/katex/"
+
 # 并行构建全部 libs/ 子项目（pnpm -r 拓扑顺序，无相互依赖则并发）。
 # 依赖安装由调用方负责（build/build-linux 用 pnpm install --frozen-lockfile，
 # dev 假设 node_modules 已存在）。
@@ -95,7 +108,7 @@ build-lightbox:   ; @cd libs && pnpm --filter @yggdrasil/lightbox run build
 build-core:       ; @cd libs && pnpm --filter @yggdrasil/core run build
 build-xterm:      ; @cd libs && pnpm --filter @yggdrasil/xterm-terminal run build
 
-dev: build-libs highlight-css
+dev: build-libs highlight-css katex-css
 	@echo "Cleaning static/..."
 	@rm -rf static/
 	@echo "Building CSS..."
@@ -188,6 +201,7 @@ docker-multiarch:
 clean:
 	@cargo clean
 	@rm -f public/style.css public/highlight.css
+	@rm -rf public/katex
 	@rm -rf public/doc
 	@rm -rf uploads/.cache
 	@rm -rf libs/node_modules libs/*/node_modules

libs/package.json

@@ -12,6 +12,7 @@
   "devDependencies": {
     "@biomejs/biome": "^2.5.3",
     "happy-dom": "^20.10.6",
+    "katex": "^0.16.22",
     "typescript": "^7.0.2",
     "vite": "^8.1.3",
     "vitest": "^4.1.10"

libs/pnpm-lock.yaml

@@ -14,6 +14,9 @@ importers:
       happy-dom:
         specifier: ^20.10.6
         version: 20.10.6
+      katex:
+        specifier: ^0.16.22
+        version: 0.16.47
       typescript:
         specifier: ^7.0.2
         version: 7.0.2
@@ -755,6 +758,10 @@ packages:
   codemirror@6.0.2:
     resolution: {integrity: sha512-VhydHotNW5w1UGK0Qj96BwSk/Zqbp9WbnyK2W/eVMv4QyF41INRGpjUhFJY7/uDNuudSc33a/PKr4iDqRduvHw==}
 
+  commander@8.3.0:
+    resolution: {integrity: sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==}
+    engines: {node: '>= 12'}
+
   convert-source-map@2.0.0:
     resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==}
 
@@ -808,6 +815,10 @@ packages:
     resolution: {integrity: sha512-Xwwo44whKBVCYoliBQwaPvtd/2tYFkRQtXDWj1nackaV2JPXx3L0+Jvd8/qCJ2p+ML0/XVkJ2q+Mr+UVdpJK5w==}
     engines: {node: '>=12.0.0'}
 
+  katex@0.16.47:
+    resolution: {integrity: sha512-Eeo8Ys1doU1z+x8AZsPpQu+p/QcZBI5PeOo7QGQdy2x2m0MU/hYagBbGOmXwr5KVbEfVuWv9LpnQWeehogurjg==}
+    hasBin: true
+
   lightningcss-android-arm64@1.32.0:
     resolution: {integrity: sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg==}
     engines: {node: '>= 12.0.0'}
@@ -1695,6 +1706,8 @@ snapshots:
       '@codemirror/state': 6.7.1
       '@codemirror/view': 6.43.6
 
+  commander@8.3.0: {}
+
   convert-source-map@2.0.0: {}
 
   crelt@1.0.7: {}
@@ -1739,6 +1752,10 @@ snapshots:
 
   highlight.js@11.11.1: {}
 
+  katex@0.16.47:
+    dependencies:
+      commander: 8.3.0
+
   lightningcss-android-arm64@1.32.0:
     optional: true