Skip to content

Conversation

@fuzi1996
Copy link

1. 字体文件目录结构重组

变更内容

将字体文件从 docs/assets/ 移动到项目根目录 fonts/,并删除 public/assets/fonts/ 下的重复字体文件。

受影响文件 (22个)

{docs/assets => fonts}/ArialMT.ttf
{docs/assets => fonts}/Courier-Bold.otf
{docs/assets => fonts}/Courier-BoldOblique.otf
{docs/assets => fonts}/Courier-Oblique.otf
{docs/assets => fonts}/Courier.otf
{docs/assets => fonts}/FangSong_GB2312.otf
{docs/assets => fonts}/Helvetica-Bold.otf
{docs/assets => fonts}/Helvetica-BoldOblique.ttf
{docs/assets => fonts}/Helvetica-Oblique.otf
{docs/assets => fonts}/Helvetica.otf
{docs/assets => fonts}/Nsimsun.ttf
{docs/assets => fonts}/SIMFANG.TTF
{docs/assets => fonts}/Times-Bold.otf
{docs/assets => fonts}/Times-BoldItalic.otf
{docs/assets => fonts}/Times-Italic.otf
{docs/assets => fonts}/Times-Roman.otf
{docs/assets => fonts}/ZapfDingbats.otf
{docs/assets => fonts}/simhei.ttf
{docs/assets => fonts}/simkai.ttf
{docs/assets => fonts}/simsun.ttf
{docs/assets => fonts}/xbst.ttf
public/assets/fonts/* (22个字体文件全部删除)

影响说明

  • 统一字体文件存放位置,避免多处维护
  • 减少项目体积,消除重复字体文件

2. HTML 内联样式移除

变更文件: index.html

移除了 18 行内联 @font-face 定义,这些定义原用于在页面加载时预加载基础字体。

删除内容:

<style>
  @font-face { font-family: 'Times-Bold'; src: url('public/assets/fonts/Times-Bold.otf'); }
  @font-face { font-family: 'NSimSun'; src: url('public/assets/fonts/Nsimsun.ttf'); }
  @font-face { font-family: 'FangSong_GB2312'; src: url('public/assets/fonts/FangSong_GB2312.otf'); }
  @font-face { font-family: 'SimFang'; src: url('public/assets/fonts/SIMFANG.TTF'); }
  @font-face { font-family: 'ArialMT'; src: url('public/assets/fonts/ArialMT.ttf'); }
</style>

影响说明

  • 字体加载现在完全由 JavaScript 动态控制(配合 commit 309e28e 的按需加载机制)
  • 减少初始 HTML 体积
  • 提升首次加载性能(字体不再阻塞页面渲染)

3. 新增字体路径配置 API

变更文件: src/liteofd/ofdFont.ts

新增了 5 个导出函数,提供字体路径的灵活配置能力:

3.1 字体预加载路径配置
let fontPreloadPath = '/liteofd/assets/fonts/'

export const setFontPreloadPath = (path: string) => {
  if (!path) {
    console.warn('[FontLoader] Font preload path is empty, using default')
    return
  }
  fontPreloadPath = path.endsWith('/') ? path : path + '/'
  console.log(`[FontLoader] Font preload path set to: ${fontPreloadPath}`)
}

export const getFontPreloadPath = () => {
  return fontPreloadPath
}

功能: 设置和获取字体文件的基础路径

默认值: /liteofd/assets/fonts/

使用场景: 当字体文件部署在不同服务器或路径时,可通过此 API 动态配置

3.2 自定义字体 URL 生成器
export type FontURLGenerator = (fontName: string, extension?: string) => string
let fontURLGenerator: FontURLGenerator | null = null

export const setFontURLGenerator = (generator: FontURLGenerator | null) => {
  fontURLGenerator = generator
  if (generator) {
    console.log('[FontLoader] Font URL generator set')
  } else {
    console.log('[FontLoader] Font URL generator reset to default')
  }
}

export const getFontURL = (fontName: string, extension = 'otf'): string => {
  if (fontURLGenerator) {
    return fontURLGenerator(fontName, extension)
  }
  return `${fontPreloadPath}${fontName}.${extension}`
}

功能: 允许用户自定义字体 URL 的生成逻辑

使用示例:

// 示例 1: 使用 CDN 地址
setFontURLGenerator((fontName, extension) =>
  `https://cdn.example.com/fonts/${fontName}.${extension || 'otf'}`
)

// 示例 2: 根据字体名称返回不同路径
setFontURLGenerator((fontName) => {
  if (fontName.startsWith('Times')) {
    return `/static/times/${fontName}.ttf`
  }
  return `/fonts/${fontName}.otf`
})

// 示例 3: 重置为默认行为
setFontURLGenerator(null)
3.3 字体加载路径适配

修改了 loadStandardFont 函数中的字体路径生成逻辑:

// 修改前
const fontPath = `/assets/fonts/${fontName}.otf`;

// 修改后
const fontPath = getFontURL(fontName, 'otf');

影响说明

  • 提供更强的灵活性,支持 CDN 部署、自定义服务器等场景
  • 向后兼容默认路径行为
  • 支持运行时动态修改字体加载策略

4. API 导出更新

变更文件: src/index.ts

新增以下导出项:

import {
  setFontPreloadPath,
  getFontPreloadPath,
  setFontURLGenerator,
  getFontURL
} from './liteofd/ofdFont';

export {
  // ... 其他导出
  ofdFont,
  setFontPreloadPath,      // 新增
  getFontPreloadPath,       // 新增
  setFontURLGenerator,      // 新增
  getFontURL                // 新增
};

export type { FontURLGenerator };  // 新增类型导出

影响说明

  • 用户可直接从主入口导入字体配置 API
  • 提供 TypeScript 类型支持

5. 构建配置调整

变更文件: vite.config.ts

// 修改前
assetFileNames: (assetInfo) => {
  if (assetInfo.name && (assetInfo.name.endsWith('.ttf') || assetInfo.name.endsWith('.otf'))) {
    return 'assets/fonts/[name][extname]';
  }
  return 'assets/[name]-[hash][extname]';
}

// 修改后
assetFileNames: (assetInfo) => {
  if (assetInfo.name && (assetInfo.name.endsWith('.ttf') || assetInfo.name.endsWith('.otf'))) {
    return 'fonts/[name][extname]';
  }
  return 'assets/[name]-[hash][extname]';
}

变更: 字体文件输出路径从 assets/fonts/ 改为 fonts/

变更文件: webpack.config.cjs

new CopyWebpackPlugin({
  patterns: [
    { from: 'public/assets', to: 'assets' },
    // { from: 'fonts', to: 'fonts' },  // 新增注释
    { from: 'src/index.d.ts', to: 'index.d.ts' }
  ],
})

变更: 注释掉了 fonts 目录的复制配置(实际通过构建工具处理)

影响说明

  • 构建产物目录结构更清晰
  • 字体文件统一输出到 fonts/ 目录
  • 与新的目录结构保持一致

fuzi1996 and others added 7 commits January 10, 2026 11:32
新增功能:
- 添加字体缓存机制,支持缓存清理和使用统计
- 实现系统字体检测和 FontFace API 的 local() 源加载
- 扩展中文字体替换映射,支持 40+ 种常见 OFD 中文字体
- 实现按需字体加载,优先使用系统字体,减少网络请求

重构内容:
- 从预加载所有默认字体改为按需加载
- 移除 LiteOfd.parse() 中的 loadLocalDefaultFonts() 调用
- 优化字体加载优先级:系统字体 > 嵌入字体 > 标准字体 > 回退字体
- 提供字体缓存统计和管理接口

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
新增 setFontPreloadPath 和 getFontPreloadPath 方法,允许用户自定义字体文件的加载路径,提升部署灵活性。

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
新增 setFontURLGenerator 函数,允许用户自定义字体文件的URL生成逻辑,
支持更灵活的字体资源部署方案(如CDN、自定义路径等)。

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
- 移除 docs/assets/fonts 和 public/assets/fonts 目录下的字体文件
- 新增统一的 fonts 目录存放所有字体文件
- 更新 index.html 中的字体路径引用
- 修改 vite.config.ts 中的字体输出路径配置
- 修改 webpack.config.cjs 添加 fonts 目录的复制规则
- 更新 src/liteofd/ofdFont.ts 中的默认字体预加载路径

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
- 移除 index.html 中的 @font-face 内联样式定义
- 将字体预加载路径从 /fonts/ 调整为 /liteofd/assets/fonts/
- 注释 webpack 中字体文件的独立复制配置

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
- 保留字体按需加载优化功能
- 合并 opentype 字体渲染支持
- 合并配置管理系统
- 合并 canvas 渲染优化
- 合并文本渲染器
- 合并路径渲染器
- 合并配置 UI
- 更新字体映射表
- 合并 develop 分支的其他功能改进
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant