「Chromebook上でWindowsを動かしてみた(QEMU/KVM)」に続き、Chromebookネタです。Chromebookを使い込んでいくと悩ましいのが「どのテキストエディタが良いの?」と言う問題。Chromebookでおおむね満足できる環境にたどり着いたので共有します。テキストエディタに求めることは人それぞれですが、ChromebookでテキストやMarkdownを書く、誰かの何かに役立てば幸いです。
いきなりマトメ
タイトルは煽りましたが、自分用のメモをまとめた地味な記事です。下書きから結構削ったのですが……3万文字超。とりあえず要点だけつかみたい方向けにいきなりマトメ。
まずはエディタで使うIMEについて考えます。学習履歴を活用できる「Google日本語入力」が良さそうです。Android版の「ATOK」は実用レベルでは使えず、Linuxアプリで使える「Mozc」は学習履歴をChrome OSと共有できません。
「Google日本語入力」が使えて、多機能なのに軽快に動くと言う理由から、ボクが選んだのは「code-server」。VS Codeのオープンソースコアを採用したブラウザ上で動く統合開発環境(ボクの中ではテキストエディタ)です。原寸大画像はこちら。
重宝しているのはtextlintを使った校正支援や、原稿内の「あとでやる」や「あとでなおす」を管理してくれるTODO管理、MarkdownをHTMLやPDF出力などを実現してくれる拡張機能たち。用途に合わせて、お好みで育てられます。
また、ファイル管理するまでもないメモやスクリーンショットを多数貼り付けるメモを作るときは「Googleドキュメント」を使っています。統合開発環境が必要なときは「VS Code」ですね。
テキストエディタの求めることは人それぞれ。すぐに使えてシンプルな「Text」(Chromeウェブストア)や、高性能ながら導入の手間が少ない「Jota+」(Google Play)など、Chromebookでは多数のテキストエディタが使えます。お気に入りのエディターを見つけて、育てて、より良いテキストエディタ生活を。
もくじ
検証機
ChromebookのIMEを見直す
テキストエディタについてお話しする前に、IME(Input Method Editor)についてお話ししましょう。Chromebookでは以下のIMEを使うことができます。
Chromebookで使えるIME
Google日本語入力
使える場所:Chromeブラウザ/Webアプリ/Androidアプリ
Linuxアプリ以外のすべてで使えるIME。これがChromebookで使う基本的なIMEです。
Mozc(などのLinuxのIME)
使える場所:Linuxアプリ
ChromebookのLinuxアプリで日本語を入力するには、自身でIMEを導入する必要があります。Mozc(モズク)はその代表格。Google日本語入力のオープンソース版です。なお、Mozcは変換エンジンなので、Fxitxのようなインプットメソッドが別途必要です。
ATOK(などAndroidのIME)
使える場所:(タブレットモード時の)Androidアプリ
AndroidアプリではAndroidのIMEが使えます。ただし、タブレットモードでしか使えません。また、キーボード付きの端末ではタブレットモードにしたとしても、端末の再起動をしないとIMEの切り替えができないことも。現時点では実用的ではありません。
現時点では「Google日本語入力」か「Mozc」を使うのが現実的ですね。
「Google日本語入力」か「Mozc」か
「Mozc」は「Google日本語入力」のオープンソース版。辞書データに差があるため、固有名詞の変換(竈門炭治郎、禰豆子、UNIQLO、Spotlight、Android、Pythonなど)は苦手ですが、機能的には「Google日本語入力」と差はありません。
問題になってくるのは「学習履歴」。Chromebookを日常使う中で鍛えた「Google日本語入力」の「学習履歴」は、「Mozc」とは共有されません。Chromebookのテキストエディタで使うIMEは、「Google日本語入力」の方が良さそうです。
「Google日本語入力」の良いところ
「Google日本語入力」の便利機能をいくつかおさらいしておきましょう。
お気に入りは計算機能。計算式を入力して変換すると計算結果になります。ポイントは=(イコール)を最後に入力することです。
シークレットモードの設定が簡単に行えるのも便利です。「こまんど」と入力して変換してみましょう。オンライン会議で画面共有する機会がある方にぜひお勧めしたい。
この2つはWindows版のATOKにも欲しい機能です。
あとは「ことし」「きょう」「いま」などで日付や時間に変換できる機能でしょうか。これはATOKの方が高性能ではあるのですが、あると助かる。
外来語や英語の固有名詞の変換機能もよく使います。Yahoo!、WordPress、YouTube、Facebookなど大文字小文字を間違えやすい単語はもちろん、Illustratorなどスペルミスしやすい単語も変換できます。
「Google日本語入力」の悪いところ
十分に使える変換精度を持った「Google日本語入力」ですが、「ATOK」と比較すると色々と劣るところがあります。
小さいことだけど"ちりつも"なのが「ATOK」の変換中の修正機能。これを「Google日本語入力」でやると、キャレットを移動させるためにキー入力が増えます。また、私は使いませんが、変換確定後の再変換機能もChromebookにはありません。
「ATOK」の連想変換機能は、言葉をど忘れしたときに便利です。
分からない言葉は使わない。「ATOK」なら入力しながら辞典もひけます。
日本語から英単語へ変換も「Google日本語入力」にはない機能ですね。なお、「ATOK」には翻訳機能すらあります。
自身にあった細かい設定ができるどうかでも「ATOK」に軍配が上がります。
これらの「Google日本語入力」にない機能は、工夫や根性でカバーするしかありません。したがって、「ATOK」に強いこだわりがある方には、Chromebookをお勧めしません。いつかChromebookでもATOKが使えるようになることを願っています。
Chromebookでクリップボード履歴を使うには
テキストエディタに行く前にもう1つだけ。すぐ終わります。
テキスト入力する上で欠かせない機能の一つがクリップボード履歴。Windowsでは[Win+v]で呼び出すあれです。
Chrome OS 88の時点では標準で搭載されていませんが、以下の文字列をブラウザのアドレスバーに入力し、フラグを有効(Enabled)にしてください。
1 |
chrome://flags/#enhanced_clipboard |
クリップボード履歴から貼り付けたいときは[検索+v]。検索は虫眼鏡アイコンのキーです。履歴に表示されるのは5つまでと少なめですが、ないよりは便利です。
メインのテキストエディタは「code-server」
やっと本題です。Chromebookでおおむね満足できる執筆環境として選んだのは「code-server」です。
「code-server」は、「Coder」のオープンソース版。VS Codeのオープンソースコアを採用し、ブラウザ上で動作します。全く同じと言うわけではありませんが(Differences compared to VS Code?)、操作感はVS Codeそのものです。
見た目はこんな感じ。メニューバーがハンバーガーメニューになっていますが、ほぼVS Codeです。原寸大画像はこちら
PWA(Progressive Web Apps)に対応しているので、Chrome OSのランチャーから起動できます。
ボクはChromebookのLinuxコンテナにインストールして使っていますが、AWSやGCPなどのクラウドサーバやVPSにもインストールできます。
VS Codeではなく、code-serverを使う理由は主に2つ。1つは「Google日本語入力」が使えること。これは前述の通り辞書データの差や学習履歴を考えると「Mozc」より「Google日本語入力」の方がベターだと思ったから。
もう1つは動作がVS Codeと比べて軽く、描画が安定していること。1つ前の記事はVS Codeで書いたのですが、致命的ではないものの描画が荒れることがありました。code-serverにしてからは、特段この点で不都合を感じません。
また、細かいことですが、VS Code(Linuxアプリ)だとChrome OSのウィンドウリサイズ機能も使えないです。code-serverなら問題ありません。ウィンドウリサイズ機能は、ウィンドウを画面の端に移動、最大化アイコンを押し続けてから左右の矢印をクリック、Alt+@もしくはAlt+]などで機能します。
- (メモ)VS Codeとcode-serverの使用メモリ比較
-
12345678910111213141516171819202122232425262728293031# Lenovo IdeaPad Duet Chromebookで両アプリのインストール直後# USS:共有メモリの使用量を除く物理メモリの使用量を比較# VS Codesmem -P /usr/share/code/code -kPID User Command Swap USS PSS RSS484 goodegg /usr/share/code/code --type 0 424.0K 6.0M 26.7M485 goodegg /usr/share/code/code --type 0 6.5M 9.1M 27.0M1456 goodegg /usr/bin/python /usr/bin/sm 0 10.7M 10.7M 12.6M551 goodegg /usr/share/code/code --type 0 12.6M 18.8M 47.2M608 goodegg /usr/share/code/code --type 0 24.7M 44.5M 97.6M630 goodegg /usr/share/code/code --insp 0 56.7M 64.0M 96.0M482 goodegg /usr/share/code/code --no-s 0 49.4M 72.9M 131.6M579 goodegg /usr/share/code/code --type 0 97.4M 120.6M 177.7M529 goodegg /usr/share/code/code --type 0 114.7M 136.4M 177.5Msmem -P /usr/share/code/code | awk '{sum += $6}END{print sum/1024"MB"}'373.043MB# code-server# ※ブラウザ側のメモリは考慮されていません。smem -P /usr/lib/code-server -kPID User Command Swap USS PSS RSS1459 goodegg /usr/bin/python /usr/bin/sm 0 8.7M 8.8M 10.5M980 goodegg /usr/lib/code-server/lib/no 0 7.8M 12.9M 35.6M93 goodegg /usr/lib/code-server/lib/no 0 17.9M 23.1M 46.1M365 goodegg /usr/lib/code-server/lib/no 0 28.4M 33.9M 57.6M763 goodegg /usr/lib/code-server/lib/no 0 29.4M 35.2M 59.1M968 goodegg /usr/lib/code-server/lib/no 0 47.3M 53.1M 77.0Msmem -P /usr/lib/code-server | awk '{sum += $5}END{print sum/1024"MB"}'130.801MB
「code-server」が満足な理由
テキストエディタに求めることは人それぞれですが、ボクが特に気に入っている点はこんな感じです。記事内で扱っている内容はページ内リンクを貼っておきます。
- 軽快に動作する。
- 「これがやりたい!」を叶えられる多機能さ。
- 日本語等倍フォントが使える。
- 導入がちょっと面倒ですが使えます。文字数を把握しやすい等倍フォントは譲れない。文字の縦が揃うのは気持ち良いですし。手順はちょっと面倒ですが……。
- 導入がちょっと面倒ですが使えます。文字数を把握しやすい等倍フォントは譲れない。文字の縦が揃うのは気持ち良いですし。手順はちょっと面倒ですが……。
- 校正支援もできる。
- 一文の長さ、ら抜き言葉、二重否定、冗長な表現などのチェックもおまかせ。
- 一文の長さ、ら抜き言葉、二重否定、冗長な表現などのチェックもおまかせ。
- MarkdownをHTMLやPDFに出力できる。
- HTML出力してGmailの本文に貼り付ければ、立派なレポートです。拡張機能「Markdown PDF」(yzane.markdown-pdf)がお気に入りです。
- HTML出力してGmailの本文に貼り付ければ、立派なレポートです。拡張機能「Markdown PDF」(yzane.markdown-pdf)がお気に入りです。
- 自動保存ができる。
- これがないと定期的に慟哭することになります。大抵のエディタにはついていますが大事。超大事。
- 折返し桁を指定できる。
- これも文字数把握に必要。30文字*10行など文字数指定のある原稿書くときには必須です。桁指定はできるのですが行番号が…(不満足な理由に続く)
- Googleドライブ上のファイルを開いて編集できる。
- ほとんどすべてがGoogleドライブ上にあるので重要。実はここも少し……(不満足な理由に続く)。
「code-server」が不満足な理由
不満な理由はこちらにまとめておきます。解決方法があるものも、いかんともしがたいものも。
- 導入がちょっと面倒
- WebアプリやAndroidアプリと比べると手順は多めです。
- 行番号の表示が論理行のみ
-
code-serverで表示される行番号は、改行コード毎に数えた論理行番号です。プログラミングならこれで良いのですが、文字数が指定された原稿を書くときには不便。
例えば、Androidのテキストエディタ「Jota+」では、このように表示されている行数で行番号を表示できます。(Jota+は論理行数での表示も選べます。)
code-serverではこれを実現する方法が見当たらないので、行数カウント用のテキストファイルを横に表示してごまかしています。
-
- スリープするとGoogleドライブのファイル編集ができなくなる
-
Chrome OS内のGoogleドライブフォルダはLinuxコンテナに共有することができ、これを利用してGoogleドライブ内のファイルを直接編集しています。しかし、この状態でChromebookをスリープさせ復帰すると、共有したはずのファイルにアクセスできなくなってしまいます。
この状態を解消するには一度ログアウトが必要です。Linuxコンテナの再起動では解消しませんでした。
これはcode-serverの問題ではなく、Chrome OSの問題です。issueも報告されていますが、現時点では不用意にスリープしないようにするしかありません。(1156860 - Crostini's gives "Transport endpoint is not connected" for Drive share after suspend and resume - chromium)
-
- Linuxコンテナを起動しないと使えない
- code-serverを自動起動する設定にしていても、Linuxコンテナが起動しないとその設定も意味がありません。そして、ChromebookではLinuxコンテナの自動起動はできない……。従って、Chromebookを再起動したら「ターミナル」を実行しないとcode-serverが使えないのです。細かいことですが、ちょっと面倒くさい。
- 拡張機能のインストールが面倒なことがある
-
code-serverもVS Codeと同様に、「拡張機能」(Ctrl+Shift+X)から拡張機能を検索して手軽にインストールできます。
しかし、マーケットプレイスはマイクロソフトのものではなく、独自のものとなります(GitHubをスクレイピングして構築しているらしい)。そのため、存在しない拡張機能があったり、存在していてもバージョンが古かったりします。
これはマイクロソフトのマーケットプレイスが、Visual Studio製品およびそのサービスでのみ利用できる規約になっているから。詳しくは以下を参考にしてください。
・code-server/FAQ.md at v3.8.0 · cdr/code-server
・Microsoft Word - Microsoft Visual Studio Marketplace Terms of Use (FINAL 12.26.2018).docx」
・Can I put the extensionsGallery on my vscode fork? · Issue #31168 · microsoft/vscode」マイクロソフトのマーケットプレイスからVSIXをダウンロードしてインストールしたり、VS Codeのextensionsディレクトリからコピーしたりとやり方はありますが、code-serverのFAQにもある通り、GitHubからVSIXを取得するか、自分でビルドしてインストールするのが良いでしょう。VSIX(ZIP形式)のインストールは、「コマンドパレット」(Ctrl+Shift+P)から"extensions:install from VSIX"コマンドを実行します。
-
インストールと初期設定
インストール手順は以下の通りです。この手順ではChromebook上のLinuxコンテナにcode-serverをインストールし、localhostからのみ接続可能にします。ついでにSSL化も行います。
なお、code-serverにはパスワードしか認証方式が用意されていません。今回はlocalhostからのみの接続なのでパスワード認証すら行っていませんが、クラウドサーバやVPSにインストールして使うならパスワード認証だけでは不安。VPN経由でのアクセスにするのが良いでしょう。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 |
# もろもろを更新 sudo apt update && sudo apt upgrade -y # インストール手順は以下も参考に。 # https://github.com/cdr/code-server/blob/v3.9.0/docs/install.md # インストールのドライラン(予行確認) curl -fsSL https://code-server.dev/install.sh | sh -s -- --dry-run # インストール(アップデートもこれ) curl -fsSL https://code-server.dev/install.sh | sh # 起動と自動起動の設定 ## これでLinuxコンテナ起動時に自動起動するようになります。 sudo systemctl enable --now code-server@$USER # 起動しているかどうかテストをしましょう ## Chromeで http://127.0.0.1:8080 にアクセスします。 ## パスワードは以下のファイル内に記載されています。 cat ~/.config/code-server/config.yaml ## http://127.0.0.1:8080 に接続しても何も表示されないなら... ### プロセスが起動しているか確認するなり... ps aux | grep code-server ### サービスを再起動するなり... sudo systemctl restart code-server@$USER # localhostからしか接続しませんがSSL化しておきます ## 今回はCA証明書とSSL証明書の作成にはお手軽なmkcertを使います ## https://github.com/FiloSottile/mkcert ### 機種に応じてダウンロード ### AArch64(ARM64)- Ideapad Duet wget -O mkcert https://github.com/FiloSottile/mkcert/releases/download/v1.4.3/mkcert-v1.4.3-linux-arm64 ### AMD64(x86-64)- HP Chromebook x360 13c wget -O mkcert https://github.com/FiloSottile/mkcert/releases/download/v1.4.3/mkcert-v1.4.3-linux-amd64 ## ここからは同じ手順 chmod +x mkcert sudo mv mkcert /usr/local/bin/ sudo apt install libnss3-tools ## CA証明書の作成 mkcert -install ### ブラウザをすべて閉じます。 ## SSL証明書の作成 mkdir ~/.cert cd ~/.cert mkcert 127.0.0.1 # 設定ファイルを書き換えます ## goodeggの部分は自分のユーザー名に置き換えてください。 vi ~/.config/code-server/config.yaml << COMMENT bind-addr: 127.0.0.1:8080 auth: none cert: /home/goodegg/.cert/127.0.0.1.pem cert-key: /home/goodegg/.cert/127.0.0.1-key.pem user-data-dir: /home/goodegg/ COMMENT ### viでコピペしようとするとビジュアルモードになって辛い... ### そんな方はviでのマウスを無効にしちゃうのも手です。 ### colorschemeはお好みで。 #### 自分の設定はこっち vi ~/.vimrc #### rootの設定はこっち vi sudo vi /root/.vimrc << COMMENT syntax on colorscheme default set mouse= COMMENT # サービスを再起動 sudo systemctl restart code-server@$USER # これでインストールは完了です。 # Chromeで https://127.0.0.1:8080 にアクセスして、 # 鍵付きで正しく表示されるか確認しましょう。 ## うまく行かない場合は... ##CA証明書がインストールされているか確認しましょう ##[Chrome]-[設定]-[プライバシーとセキュリティ]-[セキュリティ]-[証明証の管理]-[認証局]-[org-mkcert development CA]があり、さらに編集から[ウェブサイトの識別でこの証明書を信頼します:ON]になっていればOKです。 ## もしCA証明書がインストールされていない場合は... ## CA証明書のありかを表示 mkcert -CAROOT ## Linuxファイル(ホームディレクトリ)にコピー cp /home/goodegg/.local/share/mkcert/rootCA.pem ~/ ## ChromeにCA証明書を取り込みます ### [Chrome]-[設定]-[プライバシーとセキュリティ]-[セキュリティ]-[証明証の管理]-[認証局]-[インポート]-[ウェブサイトの識別でこの証明書を信頼します:ON]-[OK] # ここまで終わったらPWAとしてインストールしておきましょう ## Chromeで https:/127.0.0.1:8080 にアクセスして... ## [︙]-[code-serverをインストール]をクリック ## これでChromebookのランチャーから起動することができます。 # 日本語化したい方は... ## 拡張機能「Japanese Language Pack for Visual Studio Code」(ms-ceintl.vscode-language-pack-ja)をインストールします。 # Googleドライブのファイルを編集したい方は... ## Chromebookの「ファイル」で、Linuxコンテナと共有したいフォルダを右クリックで[Linuxと共有]を選びます。 ## Chrome OSから共有されたフォルダは以下にマウントされます。 ## /mnt/chromeos/ ## Linuxからアクセスしやすいようにシンボリックリンクを貼ると良いでしょう。 ## マイドライブ全体をLinuxに共有し、ホームディレクトリの@MyDriveからアクセスしたい場合は... ln -s /mnt/chromeos/GoogleDrive/MyDrive ~/@MyDrive # Well done! # Configure other settings and extensions as you like... # アンインストール sudo systemctl disable code-server@$USER sudo rm -r /usr/lib/code-server rm -r ~/.config/code-server/ rm -r ~/.local/share/code-server |
お気に入りのフォントを使えるようにしよう
さて、次はフォントです。code-severでフォントの設定は「Editor: Font Family」から行えます。しかし、Chromebookに内蔵されていないフォントは指定できません。ここはWebフォントの仕組みを使って解決しましょう。以下の手順は「MyricaM」を設定する場合の手順です。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
# カスタムフォントのロード機能はissueが報告されています。 # 機能が追加されていないか確認してから、以下の手順を実行することを推奨します。 # Allow custom fonts · Issue #1374 · cdr/code-server # https://github.com/cdr/code-server/issues/1374 # MyricaMをダウンロード mkdir ~/tmp cd ~/tmp wget https://github.com/tomokuni/Myrica/raw/master/product/MyricaM.zip unzip MyricaM.zip # MyricaM.TTCのままだとWebフォントとして使えないのでttfに変換します # 変換にはUniteTTCを利用させていただきます # http://yozvox.web.fc2.com/556E697465545443.html ## AArch64(ARM64)- Ideapad Duetでやるなら以下のサイトでttc->ttf変換を ## https://transfonter.org/ttc-unpack ## MyricaMM-01.ttfをダウンロードして、~/tmp/MyricaMM.ttf として配置します。☆から手順同じ wget http://yozvox.web.fc2.com/unitettc.zip unzip unitettc.zip chmod +x ./unitettc/unitettc64 ## ttcからttfに変換 ./unitettc/unitettc64 ./MyricaM/MyricaM.TTC ## MyricaM Mを使いたいので改名しておきます mv MyricaM001.ttf MyricaMM.ttf # ☆ttfをcode-serverから配信できるフォルダに移動 sudo cp MyricaMM.ttf /usr/lib/code-server/src/browser/media/ # code-serverが配信するHTMLを書き換え ## ★HTMLを書き換え ## vscode.htmlの</head>をWebフォントを配信するように書き換えます ## バックアップは /usr/lib/code-server/src/browser/pages/vscode.html.backup にできています。 sudo sed -i.backup 's/<\/head>/<style type="text\/css">@font-face{font-family:"MyricaM M";src:url("{{CS_STATIC_BASE}}\/src\/browser\/media\/MyricaMM.ttf") format("truetype");}<\/style><\/head>/g' /usr/lib/code-server/src/browser/pages/vscode.html # あとはサービスを再起動して... sudo systemctl restart code-server@$USER # 設定で"Editor: Font Family"を"MyricaM M"に変更すれば完了です。 # code-serverをアップデートすると... # vscode.htmlの内容が元に戻ってしまいます。 # その時は★のコマンドを再度実行します。 # うまく行かない場合は、Chromeのディベロッパーツールでデバックしてください。 # 手順通り操作した場合、変更前のvscode.htmlは、vscode.html.backupとしてバックアップされているはずです。 |
校正支援を活用しよう
文の長さ、ら抜き言葉、二重否定、冗長な表現などのチェックは、テキストエディタにまかせてしまいましょう。もろもろの指摘はあくまで参考で考えた方がよろしいかと思いますが、見落としの防止や校正時間の短縮には役立ちます。
以下の手順では「textlint」及び公開されている校正ルール(textlint rule)を使った方法をご紹介しています。より手軽に導入したい方には「テキスト校正くん」(ics.japanese-proofreading)がオススメです。校正ルールにこだわりがあったり、ルールをカスタマイズor自作していくぜな方はtestlintを、とりあえず試してみたい方はテキスト校正くんを選択するとよいでしょう。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 |
# この手順ではtextlintや校正ルールをシステム全体(npm install --global)にインストールしています。 # ボクは一人で書くのが大半なのでこれで問題ないですが、チームもしくはプロジェクト毎に校正環境を整えたい方などは、プロジェクト毎にインストールすることを検討してください。 # Node.jsとtextlintのインストール ## まずはnvm(Node Version Manager)をインストールします。 ## インストール等については以下が参考になります。 ## https://github.com/nvm-sh/nvm/blob/master/README.md curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash source ~/.bashrc ## Node.jsのインストール nvm install node ## textlintをグローバルにインストール npm install --global textlint # 校正ルール(textlint rule)をインストールします。 # まずは公開されている様々なtextlint ruleから自分に合ったもの選ぶのがよいでしょう。 # https://github.com/textlint/textlint/wiki/Collection-of-textlint-rule#rules-japanese # 今回は以下のtextlint ruleを利用させていただきました。 # 一般的な文章であれば、この組み合わせで基本的なチェックはできるかと思います。 # 必要に応じて、表記ゆれチェックや段落の先頭文字の指定などの小説作法チェック、使用漢字チェックなどを追加してください。 ## 技術文書向けのtextlintルールプリセット ## 文の長さ、1文内の読点の数、二重否定、ら抜き言葉など様々なルールが詰まったtextlintルールプリセット ## https://github.com/textlint-ja/textlint-rule-preset-ja-technical-writing npm install --global textlint-rule-preset-ja-technical-writing ## 例示・並列・対表現の「〜たり〜たりする」をチェックするtextlintルール ## 上記ルールプリセットの補完してくれるルール。ボクがやりがちなので。 ## https://github.com/textlint-ja/textlint-rule-prefer-tari-tari npm install --global textlint-rule-prefer-tari-tari ## 放送禁止用語をチェックするtextlintルール ## 使用をわきまえるべき単語や誤用に注意すべき単語のチェックに。 ## https://github.com/hata6502/textlint-rule-no-hoso-kinshi-yogo npm install --global textlint-rule-no-hoso-kinshi-yogo ## 不適切表現をチェックするtextlintルール ## 意図せず性的な表現が入り込まないように。 ## https://github.com/hata6502/textlint-rule-ja-no-inappropriate-words npm install --global textlint-rule-ja-no-inappropriate-words # プロジェクトルート(code-serverの"フォルダで開く"から開くディレクトリ)に設定ファイルを作ります。 # 今回は"/mnt/chromeos/GoogleDrive/MyDrive/原稿"と言うディレクトリを開いて作業すると想定します。 vi /mnt/chromeos/GoogleDrive/MyDrive/原稿/.textlintrc << COMMENT { "rules": { //技術文書向けのtextlintルールプリセット "preset-ja-technical-writing": { "sentence-length": { //1分の長さ制限を100->90文字に max: 90 }, //感嘆符、疑問符の利用を許可する "no-exclamation-question-mark":false }, //「〜たり〜たりする」のチェックをする "prefer-tari-tari": true, //放送禁止用語をチェックをする "no-hoso-kinshi-yogo": true, //不適切表現をチェックをする "ja-no-inappropriate-words": true } } COMMENT # 設定ファイルの中身はルールプリセット/ルールごとのページを参考にお好みで。 # code-serverからtextlintを呼び出せるように拡張機能「vscode-textlint」(taichi.vscode-textlint)をインストールしましょう。 ## https://marketplace.visualstudio.com/items?itemName=taichi.vscode-textlint # 「vscode-textlint」をインストールしたらcode-serverの設定(Ctrl+,)を行います。 ## 設定項目「Textlint: Node Path」にコマンド「npm root -g」の実行結果を貼り付けます。 ## 以下はあくまでボクの場合です。 ## "Textlint.nodePath": "/home/goodegg/.config/nvm/versions/node/v15.9.0/lib/node_modules" |
これでテキスト及びMarkdownの保存時にtextlintが実行され、指摘があれば問題(Ctrl+Shif+M)に表示が行われるはずです。
あとは好みで育てよう
まずは[ファイル]-「ユーザー設定」-「設定」でテキストエディタとして使いやすい設定に変更に。規定のテーマ類(Workbench: Color Theme)では不満なら、拡張機能を"theme"で検索すると幸せになれるかもしれません。
あとは拡張機能をインストールしていきましょう。前述の通り、code-serverで使えるマーケットはVS Codeと異なることに注意してください。また、あれこれと拡張機能を入れすぎると、拡張機能や端末の性能によっては重くなってしまいます。
ここではボクがcode-serverで使っている拡張機能をご紹介します。
MarkdownをHTMLやPDFに出力したいなら拡張機能「Markdown PDF」(yzane.markdown-pdf)がオススメです。PDFにして送ったり、HTMLにしてGmailの本文に貼り付けたりと利用頻度の高い拡張機能です。
長文テキストや複数のテキストファイルにまたがって作業するなら、ブックマークの指定やジャンプができる拡張機能「Bookmarks」(alefragnani.bookmarks)はいかがでしょうか。ブックマークは一覧で確認できますし、行番号の前やスクロールバーにもブックマーク位置が表示されます。
ブックマークじゃなくて、原稿内の「あとで書く」や「あとで直す」を管理したいなら「Todo Tree」(Gruntfuggly.todo-tree)がよいでしょう。TODOやFIXMEに続けてやることを書いておけば、自動的にリストアップしてくれます。
日本語を書くなら、ぜひお勧めしたい拡張機能が「Japanese Word Handler」(sgryjp.japanese-word-handler)です。Ctrl+左右カーソルでの移動がひらがな、カタカナ、読点などの文字種類毎となります。左右カーソルキーを押す回数がグッと下がるだけではなく、Ctrl+Shift+左右カーソルでの文字列選択もはかどります。
あとは定型文や原稿の雛形はスニペットに登録して、よく使う単語はGoogle日本語入力のユーザー辞書に登録しておきましょう。
- (メモ)code-serverの使用メモリ
-
123456789101112131415161718192021222324252627282930# インストール直後と、この記事の手順で紹介されていることをすべてやった場合のcode-serverが利用するメモリ使用量を比較。# USS:共有メモリの使用量を除く物理メモリの使用量を比較# 検証機:Lenovo IdeaPad Duet Chromebook# インストール直後$ smem -P /usr/lib/code-server -kPID User Command Swap USS PSS RSS1459 goodegg /usr/bin/python /usr/bin/sm 0 8.7M 8.8M 10.5M980 goodegg /usr/lib/code-server/lib/no 0 7.8M 12.9M 35.6M93 goodegg /usr/lib/code-server/lib/no 0 17.9M 23.1M 46.1M365 goodegg /usr/lib/code-server/lib/no 0 28.4M 33.9M 57.6M763 goodegg /usr/lib/code-server/lib/no 0 29.4M 35.2M 59.1M968 goodegg /usr/lib/code-server/lib/no 0 47.3M 53.1M 77.0M$ smem -P /usr/lib/code-server | awk '{sum += $5}END{print sum/1024"MB"}'130.801MB# この記事で紹介されているすべてをやった場合$ smem -P /usr/lib/code-server -kPID User Command Swap USS PSS RSS21109 goodegg /usr/bin/python /usr/bin/sm 0 10.3M 10.6M 11.9M20952 goodegg /usr/lib/code-server/lib/no 0 8.3M 15.2M 36.2M20577 goodegg /usr/lib/code-server/lib/no 0 18.0M 18.5M 21.2M20595 goodegg /usr/lib/code-server/lib/no 0 35.1M 38.0M 49.8M20608 goodegg /usr/lib/code-server/lib/no 0 40.0M 43.9M 58.7M20941 goodegg /usr/lib/code-server/lib/no 0 37.0M 62.4M 102.2M20981 goodegg /usr/lib/code-server/lib/no 0 1.2G 1.2G 1.2G$ smem -P /usr/lib/code-server | awk '{sum += $5}END{print sum/1024"MB"}'1150.32MB
code-serverの調子が悪いと感じたら
拡張機能の導入などを行っていて、code-serverの調子が悪いと感じたら、code-serverを再起動するか、ログアウトしてみましょう。拡張機能の入れすぎで、端末がスペック不足の可能性もあります。
Todo Tree v0.0.195の問題
執筆時点では、code-serverのマーケットからインストールできる「Todo Tree」はv0.0.195でした。そして、v0.0.195では”[Gruntfuggly.todo-tree]: メニュー項目が、'commands' セクションで定義されていないコマンド todo-tree.scanWorkspaceAndOpenFiles を参照しています。”と言うエラーメッセージが表示されてしまいます。(issue)
マイクロソフトのマーケットプレイスでは、すでにv0.0.196が公開されているのですが……。修正箇所はpackage.jsonを1文字直すだけなので、とりあえずそこだけ直して使っています。
1 |
sed -i 's/"command": "todo-tree.scanWorkspaceAndOpenFile",/"command": "todo-tree.scanWorkspaceAndOpenFiles",/g' $HOME/.local/share/code-server/extensions/gruntfuggly.todo-tree-0.0.195/package.json |
マイクロソフトのマーケットプレイスから最新版のVSIXをダウンロードするのがてっとり早いのですが、前述の通り利用規約違反の可能性があるならやらないし、オススメすべきではないと思うので。
サブエディタは「Googleドキュメント」
ファイルで管理するまでもないちょっとしたメモは、「Googleドキュメント」に「notepad」と言うドキュメントを作って、そこに書いています。「Google Keep」でなく「Googleドキュメント」を使う理由は履歴が残るから。
また、スクリーンショットを貼り付けながらメモを書くときも、「Googleドキュメント」を使います。[ファイル]-[ダウンロード]-[ウェブページ(.html .zip)]で出力すると、スクショがどこに行ったのか分からないということが防げ、清書するときに便利です。
サブサブエディタは「VS Code」
ボクは基本的に開発しないのですが、テキストエディタとしてではなく、統合開発環境が必要なときは「VS Code」を使っています。code-serverはテキストエディタとしての快適さを重視して設定しているのと、前述の通り拡張機能の面倒さがあるので使い分けてます。
とりあえずインストール手順のメモだけ共有しておきます。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 |
# この手順でインストールするもの # IPAフォント、MyricaM、fcitx-mozc、VS Code # もろもろを更新 sudo apt update && sudo apt upgrade -y # IPAフォントのインストール sudo apt install -y fonts-ipafont fonts-ipaexfont # MyricaMのインストール mkdir ~/tmp/MyricaM; cd $_ wget https://github.com/tomokuni/Myrica/raw/master/product/MyricaM.zip unzip MyricaM.zip mkdir ~/.fonts/ mv ./MyricaM.TTC ~/.fonts/ fc-cache --force --verbose # fcitx-mozcのインストール sudo apt install -y fcitx-mozc # fcitx-mozcの設定 ## Chromebookのランチャーより「fcitx」を起動 ## 上記のあとにターミナルから「fcitx-configtool」を起動 fcitx-configtool ## 「fcitx-configtool」の[Input Method]-[+](画面左下)をクリック ## [Only Show Current Language]はオフ ## [Search Input Method]に"Mozc"と入力、Mozcがリストに出てきたら選択して[OK] ## 「fcitx-configtool」の[Global Config]-[Trigger Input Method]でIME切り替えのトリガーとなるキーを指定します。 ## 日本語キーボードの方ならかな↔英数(Zenkakuhankaku)に設定すると良いでしょう。 ## 自動起動設定は... ### 環境変数 ### まずは3行をcros-garcon-override.confに追記 sudo vi /etc/systemd/user/cros-garcon.service.d/cros-garcon-override.conf << ADD Environment="GTK_IM_MODULE=fcitx" Environment="QT_IM_MODULE=fcitx" Environment="XMODIFIERS=@im=fcitx" ADD ### 自動機能の設定 echo "/usr/bin/fcitx-autostart" >> ~/.sommelierrc ### ここまで終わったらログアウト、ログイン ## Mozcの設定をしたいときはこちらから /usr/lib/mozc/mozc_tool --mode=config_dialog # VS Codeのインストール ## .debをダウンロードします。 ## https://code.visualstudio.com/download ## AMD64(x86-64)- HP Chromebook x360 13cなら”64bit”を ## AArch64(ARM64)- Ideapad Duetなら"ARM 64"を ## あとはダウンロードしたファイルをダブルクリックして[インストール]するだけ。 # 日本語化するには拡張機能「Japanese Language Pack for Visual Studio Code」を。 # [ファイル]-[設定]-[ユーザー設定]からFont Familyに"MyricaM M"を指定すれば日本語等倍フォントになります。 |
雑感
そんなこんなで、Chromebookでおおむね快適に「書ける」環境が整いました。この記事も今回ご紹介した環境で書いています。
Chromebookを本気で活用してみようと久しぶりに色々と触っているのですが、Linuxコンテナ(Crostini)周りが大分実用的になってきてますね。ただ、Linuxは敷居が高いですし、Crostini特有のこれはできないのかとか、これは不具合なのかとか情報収集も面倒。また、メンテンナンスの手間がいらない点や、Googleアカウントだけあればマシンの乗り換えも容易な点など、Chromebookの利点を損なってしまう使い方でもあることにも注意が必要です。自分の端末なので好きに使えばよいのですが、Linuxコンテナのバックアップは定期的に取りましょう。
さてさて。ボクは「code-server」を選びましたが、Windowsの「メモ帳」に代わりのシンプルなものをお探しなら「Text」が良いかもしれません。また、サクラエディタのようなもう少し高性能なテキストエディタをお探しなら「Jota+」が選択肢になるでしょう。EmacsマスターやVimの使い手もご安心を。使えます。
テキストエディタに求めることは人それぞれですが、この記事がお気に入りのテキストエディタ環境を作る一助になれば嬉しいです。