update at 2026-02-07 12:55:25

2026-02-07 12:55:25 +08:00
parent eb2ad134d3
commit 5036daea3e
38 changed files with 56 additions and 31 deletions
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -2,7 +2,7 @@
 <html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/assets/webicon.svg" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Font2SVG - 字体转SVG工具</title>
  </head>
--- a/frontend/public/favicon.svg
+++ b/frontend/public/favicon.svg
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -62,9 +62,15 @@ async function handleExport(format: ExportFormat) {
    if (selectedItems.length === 1) {
      // 单个字体，直接下载 SVG
      const item = selectedItems[0]
+      if (!item?.fontInfo.font) {
+        alert('选中字体未加载完成，请稍后重试')
+        return
+      }
+
+      const font = item.fontInfo.font
      const svgResult = await generateSvg({
        text: inputText,
-        font: item.fontInfo.font,
+        font,
        fontSize: uiStore.fontSize,
        fillColor: uiStore.textColor,
        letterSpacing: 0
@@ -87,9 +93,15 @@ async function handleExport(format: ExportFormat) {
      
      for (const item of selectedItems) {
        try {
+          const font = item.fontInfo.font
+          if (!font) {
+            console.warn(`字体 ${item.fontInfo.name} 尚未加载，已跳过导出`)
+            continue
+          }
+
          const svgResult = await generateSvg({
            text: inputText,
-            font: item.fontInfo.font,
+            font,
            fontSize: uiStore.fontSize,
            fillColor: uiStore.textColor,
            letterSpacing: 0
@@ -161,12 +173,12 @@ console.log('App.vue: script setup completed')
    <div class="flex gap-2 items-center shrink-0 h-24 px-2 py-1">
      <!-- webicon - 48x48 -->
      <div class="w-12 h-12 rounded-xl overflow-hidden shrink-0">
-        <img src="/assets/webicon.svg" alt="logo" class="w-full h-full object-cover" />
+        <img src="./assets/webicon.svg" alt="logo" class="w-full h-full object-cover" />
      </div>

      <!-- 星程字体转换 - 弹性宽度 -->
      <div class="shrink-0 max-w-[225px] min-w-[120px]" style="height: 72px;">
-        <img src="/assets/icons/星程字体转换.svg" alt="星程SVG文字生成 TEXT to SVG" class="w-full h-full object-contain" />
+        <img src="./assets/icons/星程字体转换.svg" alt="星程SVG文字生成 TEXT to SVG" class="w-full h-full object-contain" />
      </div>

      <!-- slider - 增加宽度 -->
@@ -176,7 +188,7 @@ console.log('App.vue: script setup completed')
          class="w-4 h-4 shrink-0 cursor-pointer hover:opacity-70 transition-opacity flex items-center justify-center p-0 border-0 bg-transparent"
          title="减小字体"
        >
-          <img src="/assets/icons/icons_idx%20_38.svg" alt="A-" class="w-4 h-4 object-contain" />
+          <img src="./assets/icons/icons_idx%20_38.svg" alt="A-" class="w-4 h-4 object-contain" />
        </button>
        <div class="flex-1 h-6 flex items-center relative">
          <input 
@@ -204,14 +216,14 @@ console.log('App.vue: script setup completed')
          class="w-6 h-6 shrink-0 cursor-pointer hover:opacity-70 transition-opacity flex items-center justify-center p-0 border-0 bg-transparent"
          title="增大字体"
        >
-          <img src="/assets/icons/icons_idx%20_33.svg" alt="A+" class="w-6 h-6 object-contain" />
+          <img src="./assets/icons/icons_idx%20_33.svg" alt="A+" class="w-6 h-6 object-contain" />
        </button>
      </div>

      <!-- 文字颜色选择 -->
      <div class="shrink-0 relative w-9 h-9">
        <label class="w-full h-full flex items-center justify-center cursor-pointer">
-          <img src="/assets/icons/choose-color.svg" alt="颜色" class="w-9 h-9 object-contain" />
+          <img src="./assets/icons/choose-color.svg" alt="颜色" class="w-9 h-9 object-contain" />
          <input
            type="color"
            :value="uiStore.textColor"
@@ -235,7 +247,7 @@ console.log('App.vue: script setup completed')
      <!-- Export Group -->
      <div class="flex items-center gap-1 shrink-0 border border-[#8552A1] rounded-lg px-1 py-1 bg-[#f7f8fa] shadow-sm">
        <div class="w-[18px] h-[42px] shrink-0 pointer-events-none">
-          <img src="/assets/icons/export.svg" alt="导出" class="w-full h-full object-contain" />
+          <img src="./assets/icons/export.svg" alt="导出" class="w-full h-full object-contain" />
        </div>

        <button
@@ -243,7 +255,7 @@ console.log('App.vue: script setup completed')
          class="w-12 h-12 shrink-0 cursor-pointer hover:opacity-85 transition-opacity flex items-center justify-center p-0 border-0 bg-transparent"
          title="导出 SVG"
        >
-          <img src="/assets/icons/export-svg.svg" alt="导出SVG" class="w-12 h-12 object-contain" />
+          <img src="./assets/icons/export-svg.svg" alt="导出SVG" class="w-12 h-12 object-contain" />
        </button>

        <button
@@ -251,7 +263,7 @@ console.log('App.vue: script setup completed')
          class="w-12 h-12 shrink-0 cursor-pointer hover:opacity-85 transition-opacity flex items-center justify-center p-0 border-0 bg-transparent"
          title="导出 PNG"
        >
-          <img src="/assets/icons/export-png.svg" alt="导出PNG" class="w-12 h-12 object-contain" />
+          <img src="./assets/icons/export-png.svg" alt="导出PNG" class="w-12 h-12 object-contain" />
        </button>
      </div>
    </div>
--- a/frontend/src/assets/icons/Button.svg
+++ b/frontend/src/assets/icons/Button.svg
--- a/frontend/src/assets/icons/checkbox.svg
+++ b/frontend/src/assets/icons/checkbox.svg
--- a/frontend/src/assets/icons/choose-color.svg
+++ b/frontend/src/assets/icons/choose-color.svg
--- a/frontend/src/assets/icons/expand.svg
+++ b/frontend/src/assets/icons/expand.svg
--- a/frontend/src/assets/icons/export-png.svg
+++ b/frontend/src/assets/icons/export-png.svg
--- a/frontend/src/assets/icons/export-svg.svg
+++ b/frontend/src/assets/icons/export-svg.svg
--- a/frontend/src/assets/icons/export.svg
+++ b/frontend/src/assets/icons/export.svg
--- a/frontend/src/assets/icons/font-icon.svg
+++ b/frontend/src/assets/icons/font-icon.svg
--- a/frontend/src/assets/icons/font-size-decrease.svg
+++ b/frontend/src/assets/icons/font-size-decrease.svg
--- a/frontend/src/assets/icons/font-size-increase.svg
+++ b/frontend/src/assets/icons/font-size-increase.svg
--- a/frontend/src/assets/icons/icons_idx
+++ b/frontend/src/assets/icons/icons_idx
--- a/frontend/src/assets/icons/icons_idx
+++ b/frontend/src/assets/icons/icons_idx
--- a/frontend/src/assets/icons/icons_idx
+++ b/frontend/src/assets/icons/icons_idx
--- a/frontend/src/assets/icons/icons_idx
+++ b/frontend/src/assets/icons/icons_idx
--- a/frontend/src/assets/icons/icons_idx
+++ b/frontend/src/assets/icons/icons_idx
--- a/frontend/src/assets/icons/icons_idx
+++ b/frontend/src/assets/icons/icons_idx
--- a/frontend/src/assets/icons/icons_idx
+++ b/frontend/src/assets/icons/icons_idx
--- a/frontend/src/assets/icons/icons_idx
+++ b/frontend/src/assets/icons/icons_idx
--- a/frontend/src/assets/icons/icons_idx
+++ b/frontend/src/assets/icons/icons_idx
--- a/frontend/src/assets/icons/icons_idx
+++ b/frontend/src/assets/icons/icons_idx
--- a/frontend/src/assets/icons/icons_idx
+++ b/frontend/src/assets/icons/icons_idx
--- a/frontend/src/assets/icons/zhedie.svg
+++ b/frontend/src/assets/icons/zhedie.svg
--- a/frontend/src/assets/icons/星程字体.svg
+++ b/frontend/src/assets/icons/星程字体.svg
--- a/frontend/src/assets/icons/星程字体转换.svg
+++ b/frontend/src/assets/icons/星程字体转换.svg
--- a/frontend/src/assets/snapshot.png
+++ b/frontend/src/assets/snapshot.png
--- a/frontend/src/assets/vue.svg
+++ b/frontend/src/assets/vue.svg
--- a/frontend/src/assets/webicon.png
+++ b/frontend/src/assets/webicon.png
--- a/frontend/src/assets/webicon.svg
+++ b/frontend/src/assets/webicon.svg
--- a/frontend/src/components/FavoritesList.vue
+++ b/frontend/src/components/FavoritesList.vue
@@ -38,7 +38,7 @@ function isInPreview(fontId: string): boolean {
      >
        <!-- 字体图标 -->
        <div class="w-4 h-4 shrink-0">
-          <img src="/assets/icons/icons_idx%20_18.svg" alt="font" class="w-full h-full" />
+          <img src="../assets/icons/icons_idx%20_18.svg" alt="font" class="w-full h-full" />
        </div>

        <!-- 字体名称 -->
@@ -52,7 +52,7 @@ function isInPreview(fontId: string): boolean {
          class="w-[18px] h-[18px] shrink-0 border rounded-full flex items-center justify-center p-0 bg-transparent"
          :class="isInPreview(font.id) ? 'bg-[#9b6bc2] border-[#9b6bc2]' : 'border-[#c9cdd4]'"
        >
-          <img v-if="isInPreview(font.id)" src="/assets/icons/checkbox.svg" alt="选中" class="w-[11px] h-[9px]" />
+          <img v-if="isInPreview(font.id)" src="../assets/icons/checkbox.svg" alt="选中" class="w-[11px] h-[9px]" />
        </button>

        <!-- 收藏按钮 -->
@@ -61,7 +61,7 @@ function isInPreview(fontId: string): boolean {
          class="w-[18px] h-[17px] shrink-0 p-0 border-0 bg-transparent"
        >
          <img
-            src="/assets/icons/icons_idx%20_19.svg"
+            src="../assets/icons/icons_idx%20_19.svg"
            alt="收藏"
            class="w-full h-full"
            :class="isFavorite(font.id) ? 'favorite-active' : ''"
--- a/frontend/src/components/FontTree.vue
+++ b/frontend/src/components/FontTree.vue
@@ -51,13 +51,13 @@ function isInPreview(node: FontTreeNode): boolean {
            >
              <img 
                v-if="node.expanded" 
-                src="/assets/icons/zhedie.svg" 
+                src="../assets/icons/zhedie.svg" 
                alt="收起" 
                class="w-[15px] h-[15px]" 
              />
              <img 
                v-else 
-                src="/assets/icons/icons_idx%20_12.svg" 
+                src="../assets/icons/icons_idx%20_12.svg" 
                alt="展开" 
                class="w-[15px] h-[15px]" 
              />
@@ -79,7 +79,7 @@ function isInPreview(node: FontTreeNode): boolean {
        <!-- 字体列表 -->
        <div v-if="node.expanded && node.children" class="flex flex-col gap-3 mt-3">
          <div
-            v-for="(child, index) in node.children"
+            v-for="child in node.children"
            :key="child.name"
            class="flex items-center gap-2 border-b border-[#c9cdd4] pb-2 relative"
          >
@@ -88,7 +88,7 @@ function isInPreview(node: FontTreeNode): boolean {
            
            <!-- 字体图标 -->
            <div class="w-4 h-4 shrink-0 ml-[17px]">
-              <img src="/assets/icons/icons_idx%20_18.svg" alt="font" class="w-full h-full" />
+              <img src="../assets/icons/icons_idx%20_18.svg" alt="font" class="w-full h-full" />
            </div>

            <!-- 字体名称 -->
@@ -102,7 +102,7 @@ function isInPreview(node: FontTreeNode): boolean {
              class="w-[18px] h-[18px] shrink-0 border rounded-full flex items-center justify-center p-0 bg-transparent"
              :class="isInPreview(child) ? 'bg-[#9b6bc2] border-[#9b6bc2]' : 'border-[#c9cdd4]'"
            >
-              <img v-if="isInPreview(child)" src="/assets/icons/checkbox.svg" alt="选中" class="w-[11px] h-[9px]" />
+              <img v-if="isInPreview(child)" src="../assets/icons/checkbox.svg" alt="选中" class="w-[11px] h-[9px]" />
            </button>

            <!-- 收藏按钮 -->
@@ -111,7 +111,7 @@ function isInPreview(node: FontTreeNode): boolean {
              class="w-[18px] h-[17px] shrink-0 p-0 border-0 bg-transparent"
            >
              <img
-                src="/assets/icons/icons_idx%20_19.svg"
+                src="../assets/icons/icons_idx%20_19.svg"
                alt="收藏"
                class="w-full h-full"
                :class="isFavorite(child) ? 'favorite-active' : ''"
--- a/frontend/src/components/SvgPreview.vue
+++ b/frontend/src/components/SvgPreview.vue
@@ -97,7 +97,7 @@ function toggleSelectItem(item: PreviewItemType) {
      >
        <div class="flex items-center gap-[8px] border-b border-[#c9cdd4] pb-[8px] pr-[8px]">
          <div class="w-[24px] h-[24px] shrink-0">
-            <img src="/assets/icons/icons_idx%20_32.svg" alt="字体" class="w-full h-full" />
+            <img src="../assets/icons/icons_idx%20_32.svg" alt="字体" class="w-full h-full" />
          </div>

          <div class="flex-1 text-xs text-[#86909c]">
@@ -109,7 +109,7 @@ function toggleSelectItem(item: PreviewItemType) {
            class="w-[18px] h-[18px] shrink-0 border rounded-full flex items-center justify-center p-0 bg-transparent"
            :class="item.selected ? 'bg-[#9b6bc2] border-[#9b6bc2]' : 'border-[#c9cdd4]'"
          >
-            <img v-if="item.selected" src="/assets/icons/checkbox.svg" alt="选中" class="w-[11px] h-[9px]" />
+            <img v-if="item.selected" src="../assets/icons/checkbox.svg" alt="选中" class="w-[11px] h-[9px]" />
          </button>
        </div>

--- a/frontend/src/types/modules.d.ts
+++ b/frontend/src/types/modules.d.ts
@@ -48,4 +48,14 @@ declare module 'opentype.js' {

 declare module 'harfbuzzjs' {
  export default function (): Promise<any>
-}
+}
+
+declare module 'harfbuzzjs/hb.js' {
+  const createHarfBuzz: any
+  export default createHarfBuzz
+}
+
+declare module 'harfbuzzjs/hbjs.js' {
+  const bindHarfBuzz: any
+  export default bindHarfBuzz
+}
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@@ -2,9 +2,6 @@ import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import UnoCSS from 'unocss/vite'
 import wasm from 'vite-plugin-wasm'
-import fs from 'fs'
-import path from 'path'
-import { homedir } from 'os'

 // https://vite.dev/config/
 export default defineConfig({
@@ -18,9 +15,5 @@ export default defineConfig({
  server: {
    host: '0.0.0.0',
    port: 5174,
-    https: {
-      key: fs.readFileSync(path.join(homedir(), 'mac.biboer.cn_ecc/mac.biboer.cn.key')),
-      cert: fs.readFileSync(path.join(homedir(), 'mac.biboer.cn_ecc/fullchain.cer'))
-    }
  }
 })