vscodeの設定用json + markdown pdf

# 場所



## 既定の（デフォルト）設定

所在不明，呼び出しても読み取り専用エディタとして出てくるだけ，どこに実体があるのかはさっぱり…



## ユーザー（グローバル）設定

```
/Users/[ユーザ名]/Library/Application Support/Code/User/settings.json
```

普段から使い回したい設定は全てこちらに書いておく，latexmk用の起爆ソースとか<br>
デフォルト設定をオーバーライドできる，対象はほぼ全てのオプション



## ワークスペース（ウィンドウ）設定

```
workspace.code-workspace
```
ワークスペースで限定的に使いたい時に書く，エディタのテーマを切り替えるとか<br>
グローバル設定をオーバーライドできる，対象はほぼ全てのオプション

vscodeのワークスペースとは即ちウィンドウ1つのこと，処理のカスタマイズはなるべく書かない方が良い気がする



## フォルダー（ローカル）設定

```
.vscode/settings.json
```
処理のカスタマイズなど環境を汚染したくない時に書く，今回はココを弄ってみる<br>
各ディレクトリに1つだけ作成できて，ワークスペースを含めてそのフォルダを開いたら必ず共有される<br>
なお`workspace.code-workspace`が存在しない場合はなぜかこれがワークスペース設定としてGUIに表示されるし，設定範囲はワークスペース設定と同じになっている，意味不明というか初見のユーザーに優しくないね…

ローカル設定をオーバーライドできる，対象は一部のオプション（ここでしか変えられないものもあるみたいだが…）




# 使い所

試しにmarkdown pdfの書式を弄ってみる



## 以下コピペ

書式の一例，`.vscode/settings.json`に以下をコピペして成形すると良い

```json:settings.json
{
    "markdown-pdf.headerTemplate":
        "<div style=\"font-size: 12px; margin:0 12px 0 12px; width:60%;\"><span style=\"float: left;\">ここにタイトル</span></div> <div style=\"font-size: 12px; margin:0 12px 0 12px; width:30%;\"><span style=\"float: left;\">ここに名前</span></div> <div style=\"font-size: 12px; margin:0 12px 0 12px; width:10%;\"><span style=\"float: right;\" class='date'></span></div>",
    "markdown-pdf.footerTemplate":
        "<div style=\"font-size: 12px; margin:0 12px 0 12px; width:60%;\"><span style=\"float: right;\">ここに署名</span></div> <div style=\"font-size: 9px; margin:0 12px 0 12px; width:40%;\" ><span class='pageNumber'></span> ページ目 / <span class='totalPages'></span> ページ中</div>"
}
```

どうやら環境変数や引数をブチ込むみたいな芸当はこれだけでは無理らしい（できるの？）

#### バグ？

`<span class='pageNumber'></span>`と`<span class='totalPages'></span>`は現在ページと合計ページをそれぞれ出力する，しかし内外からその文字サイズを`9px`より大きく設定してしまうとなぜか表示されなくなって詰む<br>
また最外の`<div>`に上下向きの`margin`を設定するとレイアウトが崩れてフッタが本文に隠されてしまい詰む，それどころか`padding`しても詰むし文字が大きすぎても詰むので，あまり大きく弄らない方が吉

前者はmarkdown pdfがやりたいhtml+cssにおける動的な注入に対して不都合であり，どうやらmarkdown-pdfのさらに実装元のプラグインであるpuppeteerにまで問題が遡るらしい，"puppeteer"+"pageNumber"+"font size"で検索してみれば「10pxにすると出ますよ」「9pxにすると出ますよ」みたいな内容が見つかる

後者は`markdown-pdf > margin:bottom`と`markdown-pdf > margin:top`の値を弄れば解決するが，あんまり大きくても見栄えが悪いし何ならタイトルページは別に作れば良いので，なるべくはスマートになるよう心がけよう

#### LaTeXとの比較
Markdownなので機能が軽いとは言えど学習コストも抑えられて設定も楽でコンパイルも手間や時間がかからずhtmlもodfも生成できると考えるとクッソ良い（個人の感想）


### サンプル
htmlの時点でこんな感じ<br>
見出しは6段階までらしい


```test.md
# welcome

## to

### my

#### slightly

##### beautiful

###### dream

####### ...?


OK.

````zsh
sudo rm -rf /
````

$$
  e^{i \pi} + 1 = 0
$$

$$
\begin{pmatrix}
  1 & 0 \\\\
  0 & 1
\end{pmatrix} \\\\
against, \\\\
\begin{vmatrix}
  1 & 0 \\\\
  0 & 1
\end{vmatrix}
$$

この世をば　我が世とぞ思ふ　望月の

欠けたることも　無しと思へば
```

```change.css
body {
    color: white;
	background-color: black
}
```

```settings.json
{
    "markdown-pdf.headerTemplate":
        "<div style=\"font-size: 12px; margin:0 12px 0 12px; width:60%;\"><span style=\"float: left;\">this is my report</span></div> <div style=\"font-size: 12px; margin:0 12px 0 12px; width:30%;\"><span style=\"float: left;\">Soluna Eureka</span></div> <div style=\"font-size: 12px; margin:0 12px 0 12px; width:10%;\"><span style=\"float: right;\" class='date'></span></div>",
    "markdown-pdf.footerTemplate":
        "<div style=\"font-size: 12px; margin:0 12px 0 12px; width:60%;\"><span style=\"float: right;\">tuned by S.E.</span></div> <div style=\"font-size: 9px; margin:0 12px 0 12px; width:40%;\" ><span class='pageNumber'></span> page of <span class='totalPages'></span> pages </div>",
    "markdown-pdf.margin.top": "2cm",
    "markdown-pdf.margin.bottom": "2cm",
    "markdown-pdf.highlightStyle": "night-owl.css",
    "markdown-pdf.styles": [
        "./change.css"
    ],
    "markdown-pdf.type": [
        "pdf",
        "html"
    ],
    "markdown-pdf.orientation": "landscape",
    "markdown-pdf.convertOnSave": true,
}
```

なんと無理矢理に横長にできてしまうし背景色もコードブロックのスタイルも弄れるのだ

だがpdfにすると余白領域が真っ白のまま，ダサ過ぎないか…？




# コアのカスタマイズ



## タイムアウトの阻止
いくらmdファイルが長くともhtmlレンダリングは一瞬で終わるが，pdfレンダリングは処理時間が30000ms（30秒）をオーバーして強制停止されることでお目当てのブツがエクスポートされないケースがある．だいたいpuppeteerの仕様のせいだが元々は異常動作をさせないためにかけられた防御であって，これをクリアするには手動でtimeout時間を0に設定する必要がある（その代わりセキュリティリスクは高まるらしいが）．

https://github.com/yzane/vscode-markdown-pdf/issues/189#issuecomment-718054350


具体的には`/Users/[ユーザ名]/.vscode/extensions/yzane.markdown-pdf-[バージョン表記]/extension.js`の407行目あたりで

```
await page.goto(vscode.Uri.file(tmpfilename).toString(), { waitUntil: 'networkidle0', timeout:0});
```

要は`await`の呼び出し先の関数`page.goto`の引数に`timeout:0`を入れてやれば良い．<br>
行数が違くても下の行に

```
// generate pdf
// https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagepdfoptions
```

とか書いてあるしわかりやすいと思われる．つーか多分このことを言ってるんじゃないかな…？

https://github.com/puppeteer/puppeteer/blob/main/docs/api.md#pagegotourl-options