2018-08-15 03:59:58 +03:00
|
|
|
# Exporting
|
|
|
|
|
|
|
|
## Static Bundle
|
|
|
|
|
|
|
|
To export your deck as a static HTML page with JS bundle,
|
|
|
|
add a `build` script to your `package.json` file.
|
|
|
|
|
|
|
|
```json
|
|
|
|
"scripts": {
|
|
|
|
"build": "mdx-deck build deck.mdx"
|
|
|
|
}
|
|
|
|
```
|
|
|
|
|
2019-03-10 06:27:03 +03:00
|
|
|
### PDF & Screenshots
|
2019-03-10 03:31:30 +03:00
|
|
|
|
2019-03-10 06:27:03 +03:00
|
|
|
To export a deck as PDF or create a PNG screenshot, install the export CLI package:
|
2019-03-10 03:31:30 +03:00
|
|
|
|
2019-03-10 06:12:02 +03:00
|
|
|
```sh
|
|
|
|
npm i @mdx-deck/export
|
|
|
|
```
|
2018-08-15 03:59:58 +03:00
|
|
|
|
2019-03-10 06:12:02 +03:00
|
|
|
Then run the following command to create a PDF:
|
2018-08-15 03:59:58 +03:00
|
|
|
|
2019-03-10 06:12:02 +03:00
|
|
|
```sh
|
2019-03-10 06:27:03 +03:00
|
|
|
mdx-deck-export pdf deck.mdx
|
2018-08-15 03:59:58 +03:00
|
|
|
```
|
|
|
|
|
2019-03-10 06:27:03 +03:00
|
|
|
Or export the first slide as a PNG:
|
2018-08-15 03:59:58 +03:00
|
|
|
|
2019-03-10 06:27:03 +03:00
|
|
|
```sh
|
|
|
|
mdx-deck-export png deck.mdx
|
2018-08-15 03:59:58 +03:00
|
|
|
```
|
|
|
|
|
|
|
|
### OG Image
|
|
|
|
|
|
|
|
To use the image as an open graph image, use the [Head](components.md#Head) component to add a meta tag.
|
|
|
|
Note that the meta tag should point to a full URL, including schema and domain name.
|
|
|
|
|
|
|
|
```mdx
|
|
|
|
import { Head } from 'mdx-deck'
|
|
|
|
|
|
|
|
<Head>
|
2019-03-10 06:27:03 +03:00
|
|
|
<meta name="og:image" content="https://example.com/card.png" />
|
2018-08-15 03:59:58 +03:00
|
|
|
</Head>
|
|
|
|
```
|