asai-vue-book — 电子书阅读器

包信息

| 建议 npm 名 | 入口文件 | $fn / 注入键 | 类型 | |------------|---------|-------------|------| | @estun/asai-vue-book | src/index.ts | AsaiVueBook → imComp | Feature |

概述

asai-vue-book 提供书架管理与章节阅读，支持分类筛选、搜索、字体/主题调节及可选拼音标注（通过 $fn.AsaiVuePinyin 运行时传入）。

集成方式

// monorepo — 延迟：lib/featurePlugs.ts
import AsaiVueBook from './plugs/asai-vue-book/src/index';
// npm
// import { imComp } from '@estun/asai-vue-book';

const { AsaiBookIndex, AsaiBook } = ujt.$fn.AsaiVueBook;

<AsaiBookIndex :ujt="ujt" />
<AsaiBook :ujt="ujt" :bookdata="{ model: 'book', book: 'id' }" :opt="{ pinyin: true }"
  :AsPinYin="ujt.$fn.AsaiVuePinyin?.AsaiPinYin" />

独立性约束

• 禁止 cross-import 其它 plugs/*（含 pinyin）。
• 禁止 import 插件目录外路径；buildCompMap 定义于插件内 src/useCompLoader.ts。
• 拼音组件经 props AsPinYin 或 $fn 注入，不在本包 import pinyin 路径。
• 数据加载用 $fn.initmodel / $db 运行时 API。

主要 API / 导出

| 导出 | 说明 | |------|------| | imComp.AsaiBookIndex | 书架首页 | | imComp.AsaiBook | 阅读器主体 | | getBookData(bookstr) | use/useBook.ts 格式解析 |

性能说明

• 延迟加载（featurePlugs）；子组件 async。
• 目录侧栏使用 VirtualList 虚拟滚动。
• 搜索 300ms 节流；书籍 txt 异步加载，失败需业务 catch。
• 长章逐段渲染 HTML 时注意 DOM 体量。

peerDependencies 建议

{
  "peerDependencies": {
    "vue": "^3.4.0",
    "@estun/asai-js-as": "^1.0.0"
  },
  "optionalPeerDependencies": {
    "@estun/asai-vue-pinyin": "^1.0.0"
  }
}

功能

AsaiBookIndex（书架）

• 卡片展示、搜索、分类筛选、响应式分页

AsaiBook（阅读器）

• 多卷/章节导航、内容搜索高亮、字体 12–52px、深/浅色主题
• 拼音标注（opt.pinyin + AsPinYin prop）
• 打印样式优化

配置

| 参数 | 说明 | |------|------| | bookdata.model | 数据模块名 | | bookdata.book | 书籍 ID | | opt.html | 是否渲染 HTML | | opt.pinyin | 启用拼音 |

数据格式

interface BookData {
  ch: string;           // 书名
  cc: Volume[];         // 卷宗
}
// Chapter: li, sn, co?, ty?

解析：getBookData() 识别 AsaiBook 标记格式或 rulechanneltobook 规则格式。

文件结构

asai-vue-book/
├── src/index.ts
├── src/useCompLoader.ts
└── src/components/
    ├── AsaiBookIndex.vue / AsaiBook.vue
    └── use/useBook.ts

技术细节

• $db[model][book] 响应式存储
• VirtualList + computed 缓存章节列表
• onBeforeUnmount 清理 watcher