Презентация
Пусть файл Markdown на вашем сайте VuePress поддерживает презентацию.
Конфиг
// .vuepress/config.ts
import { defineUserConfig } from "vuepress";
import { hopeTheme } from "vuepress-theme-hope";
export default defineUserConfig({
theme: hopeTheme({
plugins: {
mdEnhance: {
presentation: true,
},
},
}),
});
// .vuepress/config.js
import { hopeTheme } from "vuepress-theme-hope";
export default {
theme: hopeTheme({
plugins: {
mdEnhance: {
presentation: true,
},
},
}),
};
vuepress-plugin-md-enhance
использует reveal.js для поддержки этой функции.
Вы также можете передать объект для настройки.
presentation.plugins
получает массив строк, что позволяет вам свободно настраивать, включать ли некоторые предустановленные плагины.
Совет
Приемлемые плагины:
"highlight"
"math"
"search"
"notes"
"zoom"
Вы также можете использовать параметры конфигурации presentation.revealConfig
, передаваемые в Reveal.js глобально.
Reveal.js также предоставляет больше плагинов. Если вам нужен конкретный плагин, отправьте Запрос функции на GitHub.
Синтаксис
- Используйте
---
для разделения слайдов - Используйте
--
, чтобы разделить слайды во второй раз (вертикальное отображение)
@slidestart [theme]
<!-- slide1 -->
---
<!-- slide2 -->
---
<!-- slide3 -->
@slideend
Доступная тема (замените [theme]
на них):
auto
(По умолчанию)black
white
league
beige
sky
night
serif
simple
solarized
blood
moon
Для получения дополнительной информации смотрите Демо темы.
Демо
@slidestart
## Слайд 1
A paragraph with some text and a [link](https://mister-hope.com)
---
## Слайд 2
- Элемент 1
- Элемент 2
---
## Слайд 3.1
```js
const a = 1;
```
--
## Слайд 3.2
$$
J(\theta_0,\theta_1) = \sum_{i=0}
$$
@slideend
Инфо
Подробную демонстрацию смотрите в разделе Демонстрационная презентация.
Опции
Вы можете установить reveal
для передачи параметров в reveal.js для каждой страницы во фронтмейтере, вы также можете установить presentation
в параметрах плагина, чтобы установить reveal.js глобально.
Дополнительные параметры смотрите в конфигурации reveal.js. Дополнительные сведения об использовании смотрите в документации reveal.js