@flyfish-group/file-viewer3 1.0.6 → 1.0.8

package/README.md

@@ -2,14 +2,24 @@
 
 把 Word、Excel、PPT、PDF 和图片稳稳带进浏览器里。
 
-`@flyfish-group/file-viewer3` 是一款基于 Vue 3、TypeScript 和 Vite 构建的纯前端文件预览组件。它不依赖后端转码服务，适合接入 OA、知识库、附件中心、流程系统和需要离线能力的业务场景。这个项目的目标很直接: 让文档预览不再像临时拼出来的功能，而是像一个可以放心交付、能独立演示、能持续维护的产品模块。
+`@flyfish-group/file-viewer3` 是一款基于 Vue 3、TypeScript 和 Vite 构建的纯前端文件预览组件。Vue2.7 项目请使用同能力包 `@flyfish-group/file-viewer`。两条 npm 包线保持一致的格式覆盖、示例体验和 API 语义，在线 Demo 始终使用 `v3` 分支产物作为最新体验基准。
+
+它不依赖后端转码服务，适合接入 OA、知识库、附件中心、流程系统和需要离线能力的业务场景。这个项目的目标很直接: 让文档预览不再像临时拼出来的功能，而是像一个可以放心交付、能独立演示、能持续维护的产品模块。
 
 - 在线 Demo: [viewer.flyfish.dev](https://viewer.flyfish.dev)
 - 官方文档/组件主页: [doc.flyfish.dev](https://doc.flyfish.dev)
-- npm: [@flyfish-group/file-viewer3](https://www.npmjs.com/package/@flyfish-group/file-viewer3)
+- npm(Vue3): [@flyfish-group/file-viewer3](https://www.npmjs.com/package/@flyfish-group/file-viewer3)
+- npm(Vue2): [@flyfish-group/file-viewer](https://www.npmjs.com/package/@flyfish-group/file-viewer)
 - 公开成品仓库: [github.com/flyfish-dev/file-viewer](https://github.com/flyfish-dev/file-viewer)
 - 源码自助开通: [dev.flyfish.group/shop](https://dev.flyfish.group/shop)
 
+## 当前发布版本
+
+| 技术栈 | npm 包 | 最新版本 | 推荐分支 | 说明 |
+| --- | --- | --- | --- | --- |
+| Vue3 | `@flyfish-group/file-viewer3` | `1.0.8` | `v3` | 主推版本，在线 Demo 与后续上线均以此为准 |
+| Vue2.7 | `@flyfish-group/file-viewer` | `1.0.8` | `main` | 兼容 Vue2 项目，格式能力与 Vue3 保持一致 |
+
 ![Flyfish Viewer demo](https://doc.flyfish.dev/_images/demo-main.png)
 
 ## 为什么值得接入
@@ -19,7 +29,8 @@
 - **按需异步加载。** PDF、OFD、CAD、Office、Markdown 和代码高亮渲染器都按需加载，重型解析依赖不会进入其他格式的首屏路径。
 - **阅读体验更像产品。** `.doc`、`.docx`、PDF 都保留灰色工作台、白色纸张、居中阅读和自适应缩放，避免“内容能打开但不好读”的落差。
 - **Demo 更适合验收。** 示例文件按文档、表格、图纸、代码、图片等类型分组展示，点击样例即可打开并自动收起选择器。
-- **组件和独立站两用。** 既支持在 Vue 3 项目里直接作为组件使用，也支持独立部署后通过 iframe 嵌入到任意系统，方便多业务线复用。
+- **Vue2 / Vue3 体验一致。** `main` 分支面向 Vue2.7，`v3` 分支面向 Vue3；两边共享完整格式覆盖、示例文件盒子、文档站和 iframe 集成体验。
+- **组件和独立站两用。** 既支持在 Vue 项目里直接作为组件使用，也支持独立部署后通过 iframe 嵌入到任意系统，方便多业务线复用。
 - **适合成品交付。** 官方文档、在线 Demo、公开成品仓库、混淆压缩产物、npm tarball 和静态部署产物都一起维护，便于下载、验收和二次接入。
 
 ## 支持格式
@@ -42,11 +53,11 @@
 | 代码/文本 | `txt`、`json`、`js`、`mjs`、`cjs`、`css`、`java`、`py`、`html`、`htm`、`jsx`、`ts`、`tsx`、`xml`、`log`、`vue`、`yaml`、`yml`、`ini`、`sh`、`bash`、`sql`、`go`、`rs`、`php`、`c`、`cpp`、`cc`、`h`、`hpp`、`cs`、`diff` | 使用 `highlight.js` 轻量高亮，HTML 按源码展示 | 日志、配置、代码片段 |
 | 视频 | `mp4` | 浏览器原生视频播放 | 演示视频、录屏 |
 
-## 两条接入路线
+## 三条接入路线
 
 ### 1. Vue 3 组件集成
 
-适合已经在 Vue 3 项目里开发，希望最短路径完成接入的团队。
+适合已经在 Vue 3 项目里开发，希望最短路径完成接入的团队。当前在线 Demo 和生产上线均以 `v3` 分支作为最终产物来源。
 
 ```bash
 pnpm add @flyfish-group/file-viewer3
@@ -74,7 +85,45 @@ const url = ref('https://example.com/demo.pdf')
 </template>
 ```
 
-### 2. Iframe 嵌入
+### 2. Vue 2 组件集成
+
+适合仍在 Vue2.7 技术栈上，希望直接以内嵌组件方式完成接入的团队。
+
+```bash
+pnpm add @flyfish-group/file-viewer
+```
+
+```ts
+import Vue from 'vue'
+import App from './App.vue'
+import FileViewer from '@flyfish-group/file-viewer'
+
+Vue.use(FileViewer)
+
+new Vue({
+  render: h => h(App)
+}).$mount('#app')
+```
+
+```vue
+<template>
+  <div style="height: 100vh">
+    <file-viewer :url="url" />
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      url: 'https://example.com/demo.pdf'
+    }
+  }
+}
+</script>
+```
+
+### 3. Iframe 嵌入
 
 适合多系统共用一套预览器、想把预览能力独立部署、或者不希望把解析依赖带进业务包的场景。
 
@@ -122,6 +171,13 @@ pnpm dev
 
 ## 打包发布
 
+Vue3 和 Vue2 发包时分别在对应分支执行同一套发布链路:
+
+| 包 | 分支 | npm 名称 |
+| --- | --- | --- |
+| Vue3 | `v3` | `@flyfish-group/file-viewer3` |
+| Vue2.7 | `main` | `@flyfish-group/file-viewer` |
+
 建议在发布前执行下面这组命令:
 
 ```bash
@@ -149,9 +205,12 @@ pnpm release:pack
 发布到 npm:
 
 ```bash
+npm publish --dry-run --access public
 npm publish --access public
 ```
 
+如果 npm 账号启用了 MFA，请使用交互式终端完成浏览器确认后再等待发布结果。
+
 公开 GitHub 仓库只提交可直接使用的构建产物、示例、文档和 npm tarball，不提交当前源码目录。需要源码、二开包或商业自助开通的用户，可以前往 [https://dev.flyfish.group/shop](https://dev.flyfish.group/shop)，付费 4.99 后自助开通。
 
 ## 文档导航
@@ -167,4 +226,4 @@ npm publish --access public
 
 本项目使用 `Apache-2.0` 许可证。
 
-二开或商用时，请按许可证要求保留版权、许可证和来源说明，并注明项目来源为 Flyfish Viewer / `@flyfish-group/file-viewer3`。如果你基于本项目修复了通用问题或增强了通用能力，也欢迎通过 issue / PR 一起贡献回来，让这套预览能力继续变得更稳。
+二开或商用时，请按许可证要求保留版权、许可证和来源说明，并注明项目来源为 Flyfish Viewer / `@flyfish-group/file-viewer3` 或 `@flyfish-group/file-viewer`。如果你基于本项目修复了通用问题或增强了通用能力，也欢迎通过 issue / PR 一起贡献回来，让这套预览能力继续变得更稳。

package/dist/components/CadViewer.js

@@ -1 +1 @@
-(function(R,U){const ae=k,V=R();while(!![]){try{const W=-parseInt(ae(0x172))/0x1+parseInt(ae(0x177))/0x2+-parseInt(ae(0x176))/0x3*(-parseInt(ae(0x173))/0x4)+parseInt(ae(0x16b))/0x5+-parseInt(ae(0x167))/0x6*(-parseInt(ae(0x169))/0x7)+-parseInt(ae(0x168))/0x8*(parseInt(ae(0x16e))/0x9)+-parseInt(ae(0x16d))/0xa;if(W===U)break;else V['push'](V['shift']());}catch(X){V['push'](V['shift']());}}}(j,0x28da0));import{n as q,t}from'./asyncToGenerator.js';import{n,t as z}from'./objectSpread2.js';import{t as A}from'./_plugin-vue_export-helper.js';import{Fragment as B,createCommentVNode as F,createElementBlock as G,createElementVNode as H,defineComponent as I,nextTick as J,normalizeClass as K,onBeforeUnmount as L,onMounted as M,openBlock as N,ref as O,renderList as P,toDisplayString as Q}from'vue';n(),q();var v={'class':'cad-viewer'},y={'class':'cad-toolbar'},b={'class':'cad-tools'},x={'class':'cad-body'},S={'key':0x0,'class':'cad-layers'},C=['onClick'],w={'class':'cad-canvas-wrap'},T={'key':0x0,'class':'cad-state'},E={'key':0x1,'class':'cad-state\x20error'},D=A(I({'__name':'CadViewer','props':{'data':{},'type':{}},'setup'(U){const af=k;let V=U,W=O(null),X=O([]),Y=O('pan'),Z=O(af(0x17f)),a0=O(''),a1=null,a2=null,a3={'dwg':af(0x175)},a4=aa=>aa instanceof Error?aa['message']:typeof aa==af(0x170)?aa:JSON[af(0x178)](aa),a5=aa=>{Y['value']=aa,a1==null||a1['setTool'](aa);},a6=()=>{a1==null||a1['resize'](),a1==null||a1['fitToView']();},a7=aa=>{const ag=af;let ab=aa[ag(0x174)];a1==null||a1[ag(0x165)](aa['name'],ab),X['value']=X['value'][ag(0x16a)](ac=>ac['name']===aa['name']?z(z({},ac),{},{'isOff':!ab}):ac);},a8=(function(){var aa=t(function*(){const ah=k;let ab=W['value'];if(ab){Z['value']=ah(0x17f),a0['value']='';try{let {CadViewer:ac}=yield import('./dist.js');a1==null||a1['destroy'](),a1=new ac(ab,{'theme':ah(0x16c),'initialTool':Y['value'],'worker':!0x1}),a1['loadArrayBuffer'](V[ah(0x171)]),yield J(),a6(),X['value']=a1['getLayers'](),Z['value']='ready';}catch(ad){console['error'](ad),Z['value']='error',a0['value']=a4(ad)||'CAD\x20图纸解析失败';}}});return function(){const ai=k;return aa[ai(0x17e)](this,arguments);};}()),a9=(function(){var aa=t(function*(){const aj=k;let ab=V[aj(0x166)]['toLowerCase']();if(a3[ab]){Z['value']='error',a0['value']=a3[ab];return;}yield a8();});return function(){return aa['apply'](this,arguments);};}());return M(()=>{a9();let aa=W['value'];aa&&(a2=new ResizeObserver(()=>{a1==null||a1['resize'](),a1==null||a1['requestRender']();}),a2['observe'](aa));}),L(()=>{a2==null||a2['disconnect'](),a2=null,a1==null||a1['destroy'](),a1=null;}),(aa,ab)=>(N(),G(af(0x179),v,[H('div',y,[H('div',b,[H('button',{'type':'button','class':K({'active':Y['value']===af(0x16f)}),'onClick':ab[0x0]||(ab[0x0]=ac=>a5('pan'))},'平移',0x2),H(af(0x17c),{'type':'button','class':K({'active':Y['value']==='select'}),'onClick':ab[0x1]||(ab[0x1]=ac=>a5('select'))},'选择',0x2),H('button',{'type':'button','class':K({'active':Y[af(0x17d)]==='measure'}),'onClick':ab[0x2]||(ab[0x2]=ac=>a5('measure'))},'测量',0x2),H('button',{'type':'button','onClick':a6},'适配')]),H('span',null,Q(U[af(0x166)]['toUpperCase']()),0x1)]),H('div',x,[X['value']['length']?(N(),G(af(0x17a),S,[(N(!0x0),G(B,null,P(X['value'],ac=>(N(),G('button',{'key':ac[af(0x17b)],'type':'button','class':K({'muted':ac['isOff']}),'onClick':ad=>a7(ac)},Q(ac['name']),0xb,C))),0x80))])):F('',!0x0),H('div',w,[H('canvas',{'ref_key':'canvas','ref':W},null,0x200),Z[af(0x17d)]==='loading'?(N(),G('div',T,'正在解析\x20CAD...')):Z['value']==='error'?(N(),G('div',E,Q(a0['value']),0x1)):F('',!0x0)])])]));}}),[['__scopeId','data-v-cf49f0f1']]);function j(){const ak=['light','3023320XmqUnI','17937xVSPqy','pan','string','data','212494HljDUd','8gvizzU','isOff','DWG\x20是专有\x20CAD\x20格式，当前\x20Apache\x20许可包未内置\x20GPL\x20转换器。请优先上传\x20DXF，或在业务侧转换为\x20DXF\x20后预览。','358008ORqIGv','144988PQkjol','stringify','div','aside','name','button','value','apply','loading','setLayerVisible','type','5178xwOBbl','536Hmgryn','1967pCfDXg','map','1310080xiNtxs'];j=function(){return ak;};return j();}function k(a,b){a=a-0x165;const c=j();let d=c[a];return d;}export{D as default};
+const af=k;(function(R,U){const ae=k,V=R();while(!![]){try{const W=-parseInt(ae(0x10c))/0x1+-parseInt(ae(0x10d))/0x2+parseInt(ae(0x11e))/0x3*(parseInt(ae(0x119))/0x4)+parseInt(ae(0x10b))/0x5*(-parseInt(ae(0x109))/0x6)+-parseInt(ae(0x114))/0x7+parseInt(ae(0x11b))/0x8*(parseInt(ae(0x120))/0x9)+parseInt(ae(0x11c))/0xa;if(W===U)break;else V['push'](V['shift']());}catch(X){V['push'](V['shift']());}}}(j,0x1e3ab));import{n as q,t}from'./asyncToGenerator.js';import{n,t as z}from'./objectSpread2.js';import{t as A}from'./_plugin-vue_export-helper.js';function k(a,b){a=a-0x108;const c=j();let d=c[a];return d;}import{Fragment as B,createCommentVNode as F,createElementBlock as G,createElementVNode as H,defineComponent as I,nextTick as J,normalizeClass as K,onBeforeUnmount as L,onMounted as M,openBlock as N,ref as O,renderList as P,toDisplayString as Q}from'vue';n(),q();function j(){const an=['4518550gbYyyd','resize','163491FLmisT','button','98595ltelkY','cad-layers','error','onClick','86370HsmPuJ','cad-tools','30uQIgts','225067llbyNj','414306yWypdd','value','ready','canvas','measure','div','isOff','351246ZlGRqT','requestRender','length','name','setTool','4mmkgBT','toUpperCase','136QiStwx'];j=function(){return an;};return j();}var v={'class':'cad-viewer'},y={'class':'cad-toolbar'},b={'class':af(0x10a)},x={'class':'cad-body'},S={'key':0x0,'class':af(0x121)},C=[af(0x108)],w={'class':'cad-canvas-wrap'},T={'key':0x0,'class':'cad-state'},E={'key':0x1,'class':'cad-state\x20error'},D=A(I({'__name':'CadViewer','props':{'data':{},'type':{}},'setup'(U){const am=af;let V=U,W=O(null),X=O([]),Y=O('pan'),Z=O('loading'),a0=O(''),a1=null,a2=null,a3={'dwg':'DWG\x20是专有\x20CAD\x20格式，当前\x20Apache\x20许可包未内置\x20GPL\x20转换器。请优先上传\x20DXF，或在业务侧转换为\x20DXF\x20后预览。'},a4=aa=>aa instanceof Error?aa['message']:typeof aa=='string'?aa:JSON['stringify'](aa),a5=aa=>{const ag=k;Y['value']=aa,a1==null||a1[ag(0x118)](aa);},a6=()=>{const ah=k;a1==null||a1[ah(0x11d)](),a1==null||a1['fitToView']();},a7=aa=>{const ai=k;let ab=aa['isOff'];a1==null||a1['setLayerVisible'](aa['name'],ab),X[ai(0x10e)]=X['value']['map'](ac=>ac['name']===aa[ai(0x117)]?z(z({},ac),{},{'isOff':!ab}):ac);},a8=(function(){var aa=t(function*(){const aj=k;let ab=W['value'];if(ab){Z['value']='loading',a0[aj(0x10e)]='';try{let {CadViewer:ac}=yield import('./dist.js');a1==null||a1['destroy'](),a1=new ac(ab,{'theme':'light','initialTool':Y[aj(0x10e)],'worker':!0x1}),a1['loadArrayBuffer'](V['data']),yield J(),a6(),X['value']=a1['getLayers'](),Z[aj(0x10e)]=aj(0x10f);}catch(ad){console[aj(0x122)](ad),Z['value']='error',a0['value']=a4(ad)||'CAD\x20图纸解析失败';}}});return function(){return aa['apply'](this,arguments);};}()),a9=(function(){var aa=t(function*(){const ak=k;let ab=V['type']['toLowerCase']();if(a3[ab]){Z['value']=ak(0x122),a0['value']=a3[ab];return;}yield a8();});return function(){return aa['apply'](this,arguments);};}());return M(()=>{a9();let aa=W['value'];aa&&(a2=new ResizeObserver(()=>{const al=k;a1==null||a1['resize'](),a1==null||a1[al(0x115)]();}),a2['observe'](aa));}),L(()=>{a2==null||a2['disconnect'](),a2=null,a1==null||a1['destroy'](),a1=null;}),(aa,ab)=>(N(),G('div',v,[H('div',y,[H(am(0x112),b,[H(am(0x11f),{'type':'button','class':K({'active':Y['value']==='pan'}),'onClick':ab[0x0]||(ab[0x0]=ac=>a5('pan'))},'平移',0x2),H('button',{'type':'button','class':K({'active':Y['value']==='select'}),'onClick':ab[0x1]||(ab[0x1]=ac=>a5('select'))},'选择',0x2),H('button',{'type':'button','class':K({'active':Y['value']==='measure'}),'onClick':ab[0x2]||(ab[0x2]=ac=>a5(am(0x111)))},'测量',0x2),H('button',{'type':'button','onClick':a6},'适配')]),H('span',null,Q(U['type'][am(0x11a)]()),0x1)]),H('div',x,[X['value'][am(0x116)]?(N(),G('aside',S,[(N(!0x0),G(B,null,P(X['value'],ac=>(N(),G('button',{'key':ac['name'],'type':'button','class':K({'muted':ac[am(0x113)]}),'onClick':ad=>a7(ac)},Q(ac['name']),0xb,C))),0x80))])):F('',!0x0),H(am(0x112),w,[H(am(0x110),{'ref_key':'canvas','ref':W},null,0x200),Z['value']==='loading'?(N(),G(am(0x112),T,'正在解析\x20CAD...')):Z['value']===am(0x122)?(N(),G('div',E,Q(a0['value']),0x1)):F('',!0x0)])])]));}}),[['__scopeId','data-v-cf49f0f1']]);export{D as default};