部署

本指南介绍生产构建命令、构建流水线和发布产物结构。

构建命令

脚本	命令	效果
dev	pnpm --filter @compdfkit/webview dev	Vite 开发服务器（--host 0.0.0.0 --port 3032）。
dev:core	pnpm --filter @compdfkit/core build:watch	Rollup watch + sourcemap（core）。
build	pnpm --filter @compdfkit/webview build	vite build → packages/webview/dist/。
build:core	pnpm --filter @compdfkit/core build:prod	Rollup 生产构建 → webview.min.js + PDFWorker.js 到 webview/lib/。
build:webviewer	pnpm --filter @compdfkit/core build:webviewer	Rollup webviewer 配置 → webviewer.js + webviewer.global.js 到 webview/lib/。
build:release	node scripts/build-release.mjs	运行 build:core → build:webviewer → build，再组装 release/。

各包脚本

@compdfkit/webview： dev、build（vite build）、preview、test:unit（vitest run --environment happy-dom --root src/）、lint。

@compdfkit/core： clear（rimraf lib）、build（rollup -c）、build:watch、build:prod（cross-env NODE_ENV=production rollup -c）、build:webviewer。

构建流水线

完整发布流水线（build:release）按顺序运行三个构建，再组装发布文件夹：

build:core          → packages/webview/lib/webview.min.js, PDFWorker.js
build:webviewer     → packages/webview/lib/webviewer.js, webviewer.global.js
build (webview)     → packages/webview/dist/  (Vite)
scripts/build-release.mjs → release/

core 如何生成到 packages/webview/lib/

• packages/core/rollup.config.js（两个 bundle）：src/worker/compdfkit_worker.js → ../webview/lib/PDFWorker.js（ES）；src/index.js → ../webview/lib/webview.min.js（ES）。terser 含保留名称列表（WASM 绑定符号如 ComPDFKitJS、Rect，不可混淆）；Babel 目标 edge17/ff60/chrome67/safari10/ie10。
• packages/core/rollup.webviewer.config.js：webviewer.js → ../webview/lib/webviewer.js（ES）+ ../webview/lib/webviewer.global.js（UMD，全局 ComPDFKitViewer）。

Vite 配置

packages/webview/vite.config.js：

• base: './'（相对资源路径——对 iframe/S3 托管很重要）。
• 插件：@vitejs/plugin-vue、unplugin-vue-components（自动导入）、vite-svg-plugin（用于 ./src/assets/icons/）。
• 别名 @ → ./src。
• 配置中开发服务器端口 3000（被 dev 脚本覆盖为 3032）。

packages/webview/lib/ 内容

构建产物 + 预构建引擎资源：webview.min.js（+ .map）、PDFWorker.js（+ .map）、webviewer.js、webviewer.global.js，以及 ComPDFKit.js、ComPDFKit.wasm、pdf.worker.min.js、DroidSansFallbackFull.ttf、THSarabunNew.ttf、font.ff、CMYK/，和遗留的 ComPDFKit1/2.*、index.js/wasm、pdfium.js/wasm。

发布结构

scripts/build-release.mjs 复制到：

release/
├── @compdfkit/
│   ├── webviewer.global.js       # UMD 嵌入入口（全局 ComPDFKitViewer）
│   └── webviewer.js              # ES 嵌入入口
└── webviewer/
    ├── index.html
    ├── favicon.ico
    ├── assets/                    # Vite 构建的 webview 资源
    ├── locales/                   # translation-*.json（6 种语言）
    ├── images/
    ├── example/Quick Start Guide for ComPDFKit Web Demo.pdf
    └── lib/
        ├── ComPDFKit.js
        ├── ComPDFKit.wasm
        ├── PDFWorker.js
        ├── DroidSansFallbackFull.ttf
        ├── pdf.worker.min.js
        └── CMYK/

托管

部署时，将 release/webviewer/ 文件夹托管在公开 URL，并将集成方的 path 选项指向它：

ComPDFKitViewer.init(
  { path: 'https://cdn.example.com/webviewer/', pdfUrl: '...', license: '...' },
  document.getElementById('viewer')
);

• Vite 配置中的 base: './' 使所有资源路径相对，因此构建可在任意子路径下工作（iframe、S3、CDN）。
• locales/ 文件夹必须与资源一起托管（i18next-http-backend 加载 ./locales/translation-<lng>.json）。
• lib/ 文件夹（引擎 + WASM）必须以正确的 MIME 类型提供；.wasm 应以 application/wasm 提供。

CI 中的测试与 Lint

pnpm --filter @compdfkit/webview test:unit   # Vitest + happy-dom
pnpm --filter @compdfkit/webview lint        # ESLint (.vue/.js/.jsx/.cjs/.mjs)

没有工作区级别的统一测试入口。core 包除少量手动运行的 .test.js 文件外没有测试基础设施。

相关

• 快速开始 — 嵌入。
• 架构 — 构建产物的上下文。