@composy/excel-vue

@composy/excel-vue

@composy/excel-vue 是 Excel Workspace 的 Vue 3 适配包，复用 @composy/excel-core 的解析与渲染能力，提供查看器组件、组合式函数和插件。

安装

pnpm add @composy/excel-vue

vue 是 peer dependency；核心实现由 @composy/excel-core 提供。仅需框架无关能力时可直接安装 Core 包。

快速开始

<script setup lang="ts">
import { ExcelViewer } from '@composy/excel-vue'

const fileUrl = '/files/sales.xlsx'
</script>

<template>
  <ExcelViewer :src="fileUrl" />
</template>

ExcelViewer 支持 URL、File 或二进制数据入口；查看器选项、渲染选项和事件类型可从本包的类型导出中查阅。对于外部上传文件，可以通过 parserOptions 把取消信号和文件/工作表/单元格上限传给 Core 解析器：

<ExcelViewer
  :src="fileUrl"
  :parser-options="{
    signal: abortController.signal,
    maxInputBytes: 50 * 1024 * 1024,
    maxCells: 500_000,
  }"
/>

Vue SFC 自带加载与错误状态样式。需要单独引入样式时，可使用 @composy/excel-vue/es/index.css。

主要导出

Vue 包还重导出 ExcelParser 之外的一部分 Core 类型、渲染配置、搜索、导出和统计 API。完整清单以 src/index.ts 与 package exports 为准。

useFileDrop 会同时校验 MIME 类型和扩展名，避免浏览器拖放时 MIME 为空导致错误放行；onInvalidFile(file, reason) 的 reason 为 type 或 size。当前 Core 解析器的主路径是 OOXML XLSX，xls/xlsm/xlsb 的选择入口可用于宿主接入对应转换器，但在交给 ExcelParser 前应先确认实际格式和解析适配器。

目录与配置

packages/vue/
├── .ldesign/
│   ├── builder.config.ts
│   ├── eslint.config.js
│   ├── tsconfig.json
│   ├── tsconfig.cjs.json
│   └── tsconfig.typecheck.json
├── src/
│   ├── components/
│   ├── composables/
│   ├── plugins/
│   └── style/
└── package.json

包构建由 @composy/builder 与 rolldown 执行。ESLint、TypeScript 权威配置放在 .ldesign/；包根的 eslint.config.js 和 tsconfig*.json 保留为兼容入口。

构建与验证

pnpm --dir packages/vue run build
pnpm --dir packages/vue run type-check
pnpm --dir packages/vue run lint:check

构建产物包含 dist/、es/、esm/ 和 lib/，并与 package.json 的 exports、main、module、types、unpkg、jsdelivr 保持一致。

相关文档

• 工作区总览
• Core 包文档

License

MIT