Visual Studio Code で Markdown のプレビューを保存する

概要

Visual Studio Code の Markdown プレビューは なかなか見栄えが良くて気に入ってる。 そのまま保存してドキュメントとして使いたいが、 今のところ (2017/01/14、バージョン1.8.1) プレビューを保存する機能は ないようなので、同等のものを生成するスクリプトを作成した。

ネットを検索するといくつか同様のことを行うものが見つかったが、 Markdown エンジンの違いにより VSCode と出力結果が異なる (リスト内のテーブルなど) ものばかりだった。 このスクリプトは VSCode と同じ markdown-it を使用し、出力結果が同じになるようにしている。

動作に必要なもの

Node.js が必要

使い方

  1. このリポジトリをローカルにクローンする
  2. npm install する
  3. 同じフォルダにHTML化したい Markdown ファイルを入れる
  4. フォルダを Visual Studio Code で開く
  5. gulpfile.js を編集し、HTML のタイトルなどを設定する
  6. Ctrl + Shift + B を押してビルドする
  7. ビルドが終わるとできる dest フォルダに markdown.css を入れる

    ※ markdown.css は VS Codeをインストールしたフォルダの resources\app\extensions\markdown\media\markdown.css にあります。

ダウンロード

GitHub からダウンロードできます。

バッチファイルでミリ秒単位のSleepを行う

最近の Windows だと timeout コマンドを使えば秒単位で Sleep (Wait) できるがミリ秒単位ではできない。 そこで Windows PowerShell を使って以下のようにミリ秒単位で Sleep する。

[Jekyll] ビルドするときにだけSass(SCSS)を圧縮する

_config.yml に Sass(SCSS) を圧縮する設定を書くと、常時圧縮がかかってしまう。 これでは、ブラウザで表示を確認しながら CSS をいじるとき困る。 ということで、製作中は圧縮せずにビルド時だけ圧縮する方法。

※ 2016/3/4現在、 Jekyll では Sourcemap が出力できないっぽい。

1. ビルド用設定ファイルを作る

_config.yml と同じフォルダに _config-production.yml という名前のファイルを作成し、以下の通り書く

sass:
  style: compressed

参考: Assets - Jekyll • Simple, blog-aware, static sites

2. 製作時のコマンド

製作中はいつも通り。

jekyll serve

3. ビルド時のコマンド

ビルドするときは –config オプションで _config.yml と _config-production.yml の2つを読み込む。 両方のファイルに同じ設定項目がある場合は、後ろに書いた方の設定で上書きされる。 カンマとファイル名の間にスペースを入れないこと。

jekyll build --config _config.yml,_config-production.yml

参考: Configuration - Jekyll • Simple, blog-aware, static sites

Google AdSenseの確定申告

Google AdSenseでの収入が年間20万円を超えると、サラリーマンやアルバイトなど本業で源泉徴収されている人でも確定申告しなきゃいけないらしい。

参考 : No.1900 給与所得者で確定申告が必要な人|所得税|国税庁

ありがたいことに、うちも売上が20万円を超えて確定申告することになったのでメモ。

確定申告に必要なもの

  • 生命保険料控除証明書など (いつも年末調整で提出してるやつ)
  • 本業の会社からもらった源泉徴収票
  • パソコン
  • プリンター または ネットプリント などのコンビニで印刷できるサービス

申告書を作る

国税庁のホームページに 確定申告書等作成コーナー があるのでそこで作る。

  1. 「書面提出」 > 「所得税コーナー」 > 「左記以外の所得のある方(全ての所得対応)」
  2. 「給与所得」に源泉徴収票通り入力
  3. 「雑所得」の「その他」に以下の通り入力
    • 種目 : 広告収入
    • 報酬などの支払者の氏名・名称 : グーグル株式会社 グーグル合同会社 (2018/03/04 修正)
    • 所得の生ずる場所 : 東京都港区六本木6丁目10-1 六本木ヒルズ森タワー
    • 収入金額 : AdSenseでの収入金額
      (AdSenseのサイト

      「残高」右上の「…」 > 「お支払いページを表示」 > 「取引」右下の「取引を表示する」 > 上部のフィルターを「詳細取引表示」、「お支払い」、「前年」にして金額を合計する)

  4. あとは控除など必要がある場合は入力
  5. 最後にPDFファイルがダウンロードできるので、これをプリンターかネットプリントなどで印刷
  6. 印刷した申告書に捺印と署名を行い、添付書類を貼り付ける
  7. 印刷した紙に書かれている提出先税務署へ郵送する
    (普通郵便でもいいが送った記録が残らないので、万全を期すなら 特定記録書留 で)

その他

  • AdSenseでの収入を証明する書類は必要はない そうな (申告内容が不審で税務調査されない限りは)。
  • 所得税の確定申告をすれば自動で各市町村に連絡が行き住民税に反映される ので住民税の申告は必要ない。

[Jekyll] Liquidのタグをエスケープする方法

{% raw %}{% endraw %} で囲むと Liquidのタグもそのまま出力されます。

例えば

{% raw %}
<ul>
  {% for post in site.posts %}
    <li><a href="{{ post.url }}">{{ post.title }}</a></li>
  {% endfor %}
</ul>
{% endraw %}

と書いた場合の出力は以下のようになります。

<ul>
  {% for post in site.posts %}
    <li><a href="{{ post.url }}">{{ post.title }}</a></li>
  {% endfor %}
</ul>