@ceereals/vue-pdf

Vue PDF 数据

在浏览器和服务器上创建 PDF 文件的 Vue 渲染器

安装

npm install @ceereals/vue-pdf

使用量

网页

<script setup>
import { Document, Page, Text, View, PDFViewer } from "@ceereals/vue-pdf";
import { reactive } from "vue";
const viewStyle = reactive({
  flexDirection: "row",
  justifyContent: "center",
  alignItems: "center",
  height: "100%",
});

const textStyle = reactive({
  fontSize: 24,
});
</script>
<template>
  <PDFViewer>
    <Document>
      <Page size="A4">
        <View :style="viewStyle">
          <Text :style="textStyle">Hello, Vue PDF!</Text>
        </View>
      </Page>
    </Document>
  </PDFViewer>
</template>

节点

import { Document, Page, Text, View, renderToFile } from "@ceereals/vue-pdf";
import { defineComponent, h } from "@vue/runtime-core";
import fs from "fs";

const DocumentTemplate = defineComponent(() => {
    return () => (
      h(Document, [
        h(Page, { size: "A4" }, [
          h(
            View, { style: viewStyle },
            [
              h(
                Text, { style: textStyle },
                "Hello, Vue PDF!",
              ),
            ],
          ),
        ]),
      ])
    )
})

const stream = renderToFile(DocumentTemplate,'document.pdf');

文档

详情请查看 文档。 。 。 .

许可证

麻省理工学院 里卡多罗莫利