Slidev
https://sli.dev/
https://github.com/slidevjs/slidev
Slidev でスライドを作成してみました。
環境
- Windows 10 Pro
- node v14.60.0
感想
- NTFS 上にプロジェクトを配置するのであれば、Windows のnode を利用するのがよいかもしれない。WSL のnode ではファイルの更新がうまく検知されないみたい。
npm init slidevでプロジェクトを作成するとnode_modules フォルダで260MB消費された。プロジェクトは一つだけにした方がよさそう。- 生成された
slides.mdは使用せず、このフォルダ下にスライド群(.md)を作っていくのがよいかもしれない。 - PDF にエクスポートするには
npm i -D playwright-chromiumしておく。npx slidev export slidev-test.mdすると、slidev-test-export.pdfが生成される。 - ローカル画像は
publicフォルダ下に配置する。/hoge.pngで参照する。
マークダウンの例（作成中）
スライド例
Related Articles
2017-04-14
Marp
https://yhatt.github.io/marp/Markdown でスライドが作れるMarp を使ってみました。 ダウンロードと実行https://github.com/yhatt/marp/releases からアーカイブをダウンロードします。 $ mkdir marp && cd marp$ tar zxvf ../0.0.10-Marp-linux-x64.tar.gz$ ./Marp PDF 出力[File]-[Export Slides as PDF…] Hexo でPDF を表示 プラグインのインストールhttps://github.com/superalsrk/hexo-pdf$ npm install --save hexo-pdf ポストでの表記{% pdf /images/ubuntu-gnome-17.04.pdf %} 表示例
2020-05-27
Marp for VS Code
https://marp.app/https://github.com/marp-team/marp-vscodeMarp はMarkdown でスライドショーを作成できるツールです。Marp for VS Code を使ってみました。Visual Studio Code 上でMarp を使えるようになったんですね。 2020-06-05 追記Visual Studio Code 上でいろいろ書けるようになりました。 スライド本体(Markdown 形式)Marp for VS Codeで記述 図形(Draw.io SVG形式)Draw.io VS Code Integration で描画してSVG 形式で出力 グラフ(Vega SVG形式)Vega Viewer でJSON データをSVG 形式で出力 2020-07-08 追記 目次 無理やり感のある段組み 地図 テーマカスタマイズ ページ番号非表示 環境 Windows 10 Insider Preview 19631 Visual Studio Code 1.45.1 Marp fo...
Comments