eyecatch thumbnail

marp 自作テーマが適用できない人は marp-cli を使えばいいと思う

Profile picture
ルッチ / Lucci
2020.10.31

Contents


はじめに

marp の自作テーマが適用できないー! という風に頭を抱えている人向けの救済記事です.

vscode に自作テーマ css のパスを通しているのに,なぜ と困っている人は是非読んで欲しいです.

その問題 marp-cli を使えば解決できますよ.

本記事では marp-cli の最低限の使い方をご紹介します.

気になる方は読み進めていただければと思います.


marp-cli をインストールする

さて,まずは marp-clinpm コマンドでインストールしましょう.

$ npm install -g @marp-team/marp-cli

npm コマンドがまだ有効になっていない方は, asdf node.js のバージョン管理方法 を読んで適当な nodejs をインストールしてください.

nodejs がインストールされればそれに付随して npm もインストールされますので,ぜひ!


marp コマンドでスライドを作成する

marp-cli をインストールしたら marp コマンドが使えるようになっているはずです.

marp コマンドがインストールされているかどうかは $ which marp など実行すればわかります.

ちなみに筆者の環境 (MacOS 10.15.7) では以下の通りでした.

$ which marp
/usr/local/bin/marp

marp コマンドの基本的な文法

ということで早速 marp コマンドを実行してみましょう.

基本的な文法は $ marp /path/to/example.md です.

$ marp /path/to/example.md

このコマンドを実行すると /path/to/example.md と同じディレクトリに /path/to/example.pdf が生成されます.

続いて,marp コマンドのオプションについてみてみましょう.


marp コマンドのテーマオプション設定

marp コマンドで主に筆者が使っているオプションは次の3つです.

  • --pdf pdf を生成することを明示的に宣言する
  • --preview プレビューを表示する
  • --theme /path/to/theme.css テーマを指定する

これらのオプションを使った marp コマンドは例えばこんな感じ.

$ marp \
  --pdf \
  --preview \
  --theme /path/to/theme.css \
  /path/to/example.md

/path/to/theme.css は .zshrc に定義しておくと良い

自作テーマへのパスをいちいち書くのは面倒くさいので, .zshrc などに環境変数を定義しておくと良いかなと思います.

例えば,筆者は以下の文を .zshrc に書いています.

# --------------------------------------------
# Marp mytheme
# --------------------------------------------
MARP_THEME_TYPEMEMO="$HOME/typememo/tools/res/marp_theme_typememo.css"

やっぱり環境変数を定義しておくと,とても便利ですねー.


おわりに

marp-cli を使うとめっちゃ便利だぞ,という筆者の思いは伝わりましたでしょうか?

marp の自作テーマが適用できずに悶々している人がこの記事を読んで,すっきりすることを祈っています.

marp は本当に便利ですねー.

最後までお読みいただきありがとうございました.

応援していただけるととても嬉しいです!


愛用品


関連記事


大学生へのお知らせ

ここまで記事を読んでくれて本当に嬉しいです、ありがとうございます。

プログラミングを始めたばかりの頃って「やるぞ!」という気持ちは強めですが、 実際に取り組み始めると「何からどうやってどこまでやればいんだ?」 という感じで羅針盤を失うことが多いような気がします。(実体験)

そんな勉強熱心で向上心高めなんだけど目指す姿が曖昧な大学生の方に感謝の意も込めて、就職活動までサポートするプログラミングスクール「レバテックカレッジ」を紹介します。↓

Levtech-college

「自走力」のあるエンジニアを最短3ヶ月で目指せるカリキュラムが月額30,000円で用意されていて、 現段階の「目指す姿が曖昧で何から手をつければいいかわからない状態」から脱却できます。

自分は実際にIT企業で働いていますが、「自走力」のあるエンジニアの方にはいつも助けられています。

なので、目指す姿が曖昧な人はとりあえずレバテックカレッジが導いてくれる 「自走力のあるエンジニア」を目指してみるのはスタートダッシュとしてはアリです。

レベルアップしてからジョブチェンするのはRPGでも常套手段ですし、 レバテックカレッジで一通りのスキルを習得してから自分の目指す姿を再定義するといいかもです。

「自走力のあるエンジニア」って実際どんなエンジニアなの? 何から手をつければいいかわからないから教えて欲しい、 という人は上のテキストリンク/画像リンクから「無料相談会」への申し込みをお願いします。

よきエンジニアライフを!