C101PAにVS Codeをインストールする

安価なChromebook C101PAでもローカル環境で開発できるようにしたい

Linuxをインストール

標準で利用できるLinuxを使います。
Chromebookの設定で linux と検索して出てくる設定を「オン」にして、Linuxをインストールしてください。

安定のアップデート

$ sudo apt-get update
$ sudo apt-get upgrade
$ sudo apt-get dist-upgrade

VS CODEをインストール

VS CODEをダウンロード

下記のページの Pre-built deb package から Latest のパッケージをダウンロードしてください。
https://www.reddit.com/r/Crostini/wiki/howto/install-vscode

ダウンロードしたdebファイルをダブルクリックすればインストールできます。
アプリ一覧に「code-oss」というアプリが追加され、それがVS Codeになります。

Extension Gallery を有効化

設定用のjsonファイルを編集します。

$ sudo apt-get install nano
$ sudo nano /usr/share/code-oss/resources/app/product.json

開いたjsonファイルに以下を追加してください。

"extensionsGallery": {
    "serviceUrl": "https://marketplace.visualstudio.com/_apis/public/gallery",
    "cacheUrl": "https://vscode.blob.core.windows.net/gallery/index",
    "itemUrl": "https://marketplace.visualstudio.com/items"
}

再起動するとExtension Galleryが使えるようになっています。

日本語化

フォントをダウンロード

フリーで使うことができるフォントを用意します。
以下のページからzipファイルをダウンロードしてください。
https://github.com/adobe-fonts/source-han-code-jp/releases/latest

zipファイルを開き、OTFフォルダをそのまま「Linux ファイル」へ移動させてください。

フォントをインストール

下記のコマンドでインストールしてください。

$ mkdir ~/.fonts
$ cp ./OTF/* ~/.fonts
$ sudo fc-cache -fv

フォントを設定

• VS Codeでの手順
  1. Preferences > Settingsを開く
  2. Search settingsに font と入力
  3. Editor: Font Familyの先頭に Source Han Code JP L を追加

日本語を設定

• VS Codeでの手順
  1. Extension gellery で japanese と入力して検索
  2. Japanese Language Pack for Visual Studio Codeをインストール

VS Codeを再起動すると日本語に変わっています。

Node.js をインストール

nvm をインストール

$ git clone git://github.com/creationix/nvm.git ~/.nvm
$ source ~/.nvm/nvm.sh
$ nvm install v10
$ nvm use v10

~/.profile末尾に以下を追加

source ~/.nvm/nvm.sh

Node.js と npm のインストール

$ nvm install stable
$ nvm use stable