PDF file embedding plugin for displaying a PDF viewer in the page.
::: npm-to
npm install vitepress-plugin-pdf:::
import { defineConfig } from 'vitepress-tuck'
import pdf from 'vitepress-plugin-pdf'
export default defineConfig({
plugins: [pdf()],
})Learn more about vitepress-tuck{.readmore}
import { defineConfig } from 'vitepress'
import { pdfMarkdownPlugin } from 'vitepress-plugin-pdf'
export default defineConfig({
markdown: {
config: (md) => {
md.use(pdfMarkdownPlugin)
},
},
})import type { Theme } from 'vitepress'
import { enhanceAppWithPDF } from 'vitepress-plugin-pdf/client' // [!code ++]
import DefaultTheme from 'vitepress/theme'
export default {
extends: DefaultTheme,
enhanceApp(ctx) {
enhanceAppWithPDF(ctx) // [!code ++]
},
} satisfies ThemeEmbed a PDF using @[pdf]():
@[pdf](https://example.com/sample.pdf)
@[pdf](./sample.pdf)@[pdf page="3"](https://example.com/sample.pdf)
@[pdf p="3"](https://example.com/sample.pdf)@[pdf no-toolbar width="100%" height="600px" zoom="100"](https://example.com/sample.pdf)| Attribute | Type | Default | Description |
|---|---|---|---|
width |
string |
'100%' |
Width |
height |
string |
- | Height |
ratio |
number | string |
- | Aspect ratio |
zoom |
number |
50 |
Zoom level |
no-toolbar |
boolean |
false |
Hide toolbar |
@[pdf](https://plume.pengzhanbo.cn/files/sample-1.pdf)