TadaoYamaokaの開発日記

個人開発しているスマホアプリや将棋AIの開発ネタを中心に書いていきます。

VSCodeでMarkdownの編集

今までMarkdownテキストエディタで手書きしていましたが、Visual Studio Codeは標準でMarkdownのプレビューに対応しているので、Markdownのエディタとして使い始めた。
拡張機能をインストールすると表のフォーマットも自動で行ってくれる。

Markdown Extended」という拡張を入れると、Excelからそのまま貼り付けができるのでMarkdownでの表の記述が楽になる。
この拡張はExcelから貼り付ける時に表のフォーマットも行ってくれるのだが、漢字は問題ないが、ひらながを使っていると幅が1と判断されて崩れてしまう。
f:id:TadaoYamaoka:20190702160944p:plain

ソースはGitHub公開されているので、簡単に直せないかと調べたら、正規表現を少し直すだけで対応できそうだった。
issuesの履歴を見ると漢字の対応は、中国からのPull Requestで対応しているようだった。

とりあえずissueを上げてみたが、ひらがなの対応は日本からPull Requestすべきと思ったので、Pull Requestしてみた。

以下、VSCode拡張機能をテストしてPull Requestするまでの手順のメモです。

VSCode拡張機能の開発環境

公式のページに解説がある。
Your First Extension | Visual Studio Code Extension API

新規で作成する場合の手順なので、既存のプロジェクトを修正する場合は、Node.jsがあればよい。

プロジェクトのフォーク

GitHubでプロジェクトをフォークして、フォークしたプロジェクトをローカルにcloneする。

TypeScriptインストール

元のソースはTypeScriptで記述されていたので、npmからTypeScriptをインストールした。

npm installl -g typescript

依存パッケージインストールとビルド

VSCodeでプロジェクトを開いて、依存パッケージをインストールする。
VSCodeのnpm拡張をインストールしている場合、コマンドパレットからnpm installを選択する。

ソースを修正して、Ctrl+Shift+Bでビルドする。
以下のエラーがでたので、ネットで調べてtsconfig.jsonのlibに"dom"を追加した。

node_modules/@types/puppeteer/index.d.ts(16,46): error TS2304: Cannot find name 'Element'.

コンパイルエラーになる行が1行だけあったので、コメントアウトした。
おそらくTypeScriptのバージョンに依存した問題と思われるが、テストしたい箇所とは関係ないのでコメントアウトで対応した。

テスト

F5を押して、実行する。
もう一つVSCodeが起動し、その中で拡張機能のテストができる。

Excelからの貼り付けで、正しくフォーマットされることが確認できた。
f:id:TadaoYamaoka:20190702161110p:plain

コミットとプッシュ

コミット時にissueと関連付けるために、「#51」のようにissueの番号をコメントの末尾に付加する。
フォークしたプロジェクトにプッシュする。

Pull Request

フォークしたプロジェクトのGitHubのページのNew pull requestからPull Requestを送る。

マージ

1分後にマージされた。
数時間前に他のissueの修正のコミットがあったのでちょうどコミッタが作業中のタイミングだったようだ。


まだマーケットプレイスには反映されていませんが、そのうち反映されると思います。

2019/7/2 追記

v1.0.10で反映されました。

2019/7/2 追記

カタカナの濁点でも1文字幅と判断されていたので、(自分が送られる側だとまとめて送ってほしいところだけど)再度プルリクエストを送った。

2019/7/3 追記

Pull requestを送った内容とは別の方法で修正されたのだが、長音記号を含んでいないためコメントを送った。
↓修正された方法

     "\\p{Script=Katakana}", 
     "\\p{Script=Hiragana}", 

後で気付いたが、全角の記号とか絵文字とかも含まれていない。
これは別問題で小出しに送るのもよろしくないので今回は記号の件はコメントしなかった。
多言語処理ややこしい。