slide.md

Error in user YAML: (<unknown>): found character that cannot start any token while scanning for the next token at line 5 column 9

---

title: marp-cli を試す
description: 
url:
page_number: true
footer: @matoken
marp: true

---

Marp CLI を試す

Kenichiro MATOHARA (@matoken) https://matoken.org

---

Marp Next!

• Marp の開発が終了して Marp Next が開発中
• Marp family の Marp CLI を少し試してみる

GitHub - marp-team/marp-cli: A CLI interface for Marp and Marpit based converters

---

hello

• hoge
• fuga

---

にゃーん

• :cat: -> 🐱
• 👍

---

こんな感じ

---

試し方

• npx / npm / Docker
• とりあえず npx で動かすのがお手軽(要onlineなので出先等で触る場合は注意)

---

主なオプション

• marp ./slide-deck.md # htmlに変換
• marp ./slide-deck.md --pdf # pdfに変換(Google Chrome利用)
• marp ./slide-deck.md --image # 画像(png/jpg)に変換
• marp ./slide-deck.md -o converted.[html/pdf/png/jpg]
• marp -w ./slide-deck.md # ウォッチモード
• marp -s ./slidedir # サーバモード(ディレクトリ指定)
• marp -p ./slide-deck.md # プレビューウィンドウ

---

ウォッチモード/サーバモード/プレビュー

• ファイル更新時に自動再レンダリングされる(ブラウザの自動更新機能は不要)
• ウェブブラウザで変換結果が確認できる
• 好きなテキストエディタで編集
• サーバモードではhttp経由で確認 リモートアクセスも出来るのでtcp8080を許可して同じネットワークで共有できる(netmask等で制限するオプションは無さそうなのでiptableなどで制限?) pdf書き出しもリンクを押すだけで出来る

---

ローカルのファイルを使いたい bug?

• -o slide.pdf や サーバモードでの pdf 書き出しで画像が書き出されない
• Chrome で html を Ctrl + p -> 「PDF に保存」ではok
• ローカルファイルを使う場合はオプションが必要だった 以下 README.md より

  --allow-local-files Allow to access local files from Markdown while converting PDF (NOT SECURE)

---

html を使いたい

• 既定値ではhtml は解釈されずそのまま表示されるので --html オプションを使う

--html  Enable or disable HTML (Configuration file can pass the whitelist object if you are using Marp Core)

※URLが削られてしまうことがある?

## source

https://gist.github.com/5da13dacaca0443c619108943db1a3bf

が以下のようにURL途中で途切れた

``で囲んでごまかしてみたり

---

旧Marpと比べて

• Electron -> Node
• cli で動く :)
• ARM端末でも動く :) (旧Marpでも行けたのかもだけど手元ではbuild失敗してた)

---

GUI?

• Marp Web，Marp VSCode(VSCodeのextention)が存在する
• その他Marp Webのデスクトップ版がplanned
  • marp-team/marp-web: [UNDER CONSTRUCTION] Markdown presentation writer for web interface
  • marp-team/marp-vscode: Marp for VS Code: Preview Marp slide deck in VS Code

---

Marp Web

---

Marp VSCode extention

marp: true を設定するとプレビューがスライド形式になる

---

試した環境1(Marp CLI, Marp VSCode extention)

$ marp -v
@marp-team/marp-cli v0.8.1 (/w bundled @marp-team/marp-core v0.8.0)
$ dpkg-query -W google-chrome-stable chromium
chromium        73.0.3683.75-1
google-chrome-stable    73.0.3683.103-1
$ code -v
1.33.1
51b0b28134d51361cf996d2f0a1c698247aeabd8
x64
$ jq .version ~/.vscode/extensions/marp-team.marp-vscode-0.2.0/package.json 
"0.2.0"
$ lsb_release -dr
Description:    Debian GNU/Linux buster/sid
Release:        unstable
$ uname -m
x86_64

---

試した環境2(Marp CLI)

$ marp -v
@marp-team/marp-cli v0.8.1 (/w bundled @marp-team/marp-core v0.8.0)
$ dpkg-query -W chromium-browser
chromium-browser        73.0.3683.86-0ubuntu0.18.04.1
$ lsb_release -d
Description:    Ubuntu 18.04.2 LTS
$ uname -m
aarch64

---

source

https://gist.github.com/5da13dacaca0443c619108943db1a3bf