/var/www/yatta47.log

/var/www/yatta47.log

やったのログ置場です。スクラップみたいな短編が多いかと。

marpでChromeを入れろと出たらDockerでやればよい

f:id:yatta47:20210103010211p:plain

スライド作るのに、Marpってのを使ってみました。

Markdownでスライドが作れるってなかなか便利だなと思って使ってみました。実際の感想としてみては便利だという感覚はあったのですが、一つ障害が。

PDF出力しようとしたら以下のエラーが!

$ marp --pdf --allow-local-files base.md 
[  INFO ] Converting 1 markdown...
[  WARN ] The environment variable CHROME_PATH must be set to executable of a build of Chromium version 54.0 or later.
[ ERROR ] Failed converting Markdown. (You have to install Google Chrome, Chromium, or Microsoft Edge to convert slide deck with current options.)

なんてこった・・・・ChromeChromiumもしくはEdgeが入っていないとPDF化が出来ないのか。

自分の作業環境としては出来る限り余計なものは入れたくないのでどうにかならんかなと考えていたら、Dockerでやればいいじゃんという結論になり、うまく言ったので記事に残しておく。

 

使ったコマンドライン

$ docker run --rm --init -v $PWD:/home/marp/app/ -e LANG=$LANG marpteam/marp-cli base.md --pdf

上記のコマンドラインで実行します。

ただ、2つほど問題が。

 

Pemission Deniedと出る

いざ実行してみたら、以下のようにpermission deniedが出てファイル出力できませんでした。

[  INFO ] Converting 1 markdown...
[ ERROR ] Failed converting Markdown. (EACCES: permission denied, open
          '/home/marp/app/base.pdf')

これについては、markdownファイルが置いてあるディレクトリのパーミッションを変更(具体的には775)にすることで解決しました。

docker内のユーザとコマンド実行したユーザが一致しないとmarp関係なくよく起こる現象ですね。

 

フォントがダサい

実際に出力されたPDFを確認すると、なんかフォントがダサい。

調べてみたところ、docker内部で持っているフォントをベースに変換されるので、ホスト側で見ていたフォントがないとデフォルトフォントになって変換されるらしい。

ってことで、markdownファイル内に以下のように書くことで解決しました。

---
marp: true
theme: base
style: |
    h1, h2, h3, h4, h5, header, footer {
        color: black;
    }
    section {
        background-color: white;
        font-family: 'M PLUS 1p';
        color: black;
    }
footer: "@yatta47"
---

<style>
@import url('https://fonts.googleapis.com/css?family=M+PLUS+1p');
section {
    font-family: 'M PLUS 1p', serif;
}
</style>

# タイトル

これでWebフォントとしてdocker内でも持ってきてくれるみたいで、思った通りになりました。

 

まとめ

ということでまとめ。

  • Chromeを入れろと出てきたら、dockerで対応
  • dockerで実行時にPermission Deniedと出たらmarkdownファイルが置いてあるディレクトリのパーミッションを変更する
  • フォントが思い通りにならなかったらmarkdownファイル内にフォントを記載する

marp便利ですね。

ちょっとした記録はブログに残していたけど、これからはスライドに残すということもできそうです。

まぁ・・・・

Googleスライドのほうが慣れているけど

それではー。