Graphics/2021/Setup/ConfigureVSCode

【Graphics/2021用】 Visual Studio Code の設定 †[edit]

2021年度「グラフィックス基礎及び実習」で利用するエディタ Visual Studio Code の設定の話です．

起動 †[edit]

Windows

デスクトップのアイコンをクリック，またはスタートメニューから「Visual Studio Code」を選択して起動．起動後は，タスクバーのアイコンを右クリック（またはCTRL押しながらクリック）して「タスクバーへピン留め」しとくとよい．

macOS

Finderから 「アプリケーション」の中のアイコンをクリック，または「Launchpad」から．起動後は，Dockのアイコンを右クリック（またはCTRL押しながらクリック）して「オプション」 > 「Dockへ追加」しとくとよい．

実習室Linux環境

コマンドラインから（「端末」で）

$ code

または，デスクトップ左下の 田 な感じのアイコンをクリック > Visual Studio Code． 起動後は，ランチャーのアイコンを右クリックして「お気に入りに追加」しとくとよい．

メニュー等の日本語化 †[edit]

(1) VSCode を起動．

(2) 左のアイコン（四角形4つ田で右上のだけ浮いてる） をクリックして，上の検索窓へ japanese と入力すると，インストール可能な拡張機能がずらずら出てくる．たぶん一番上に「Japanese Language Pack for Visual Studio Code」というのがある（Microsoft が作者のもの）ので，Install を押す．

(3) ポップアップウィンドウが出て，「設定を有効にするには再起動が必要」みたいなことを言われる．「Restart」をクリック．

(4) VSCode が再起動すると，メニュー等が日本語されている．

【Windowsのみ】 Java ソースファイルの文字コード設定を Shift JIS にする †[edit]

Windows以外の環境ではこの作業を行ってはいけません

コンピュータで文字を扱う際は，文字や記号を0/1の並びに対応づけることが必要です．その体系を「文字コード」と言います． 日本語の環境だと，UTF-8 や Shift JIS(SJIS) と呼ばれるものを目にする機会が多いでしょう． 日本語を扱う場合，近頃の Linux や macOS では UTF-8 が標準なのですが， Windows は昔から Shift JIS が標準です． 文字コードを間違えるといわゆる「文字化け」になりますので，情報をやりとりする際に気をつけないといけません．

VSCode では Windows 環境でも UTF-8 がデフォルトなので，そのままだと，日本語を含むファイルを UTF-8 で符号化してしまいます．一方で， InstallJDK でインストールしてもらった JDK のコンパイラ javac は，Shift JIS を受け付けます． VSCode で日本語を含むプログラムを作っても,そのままでは javac でコンパイルできない（エラーが出る）ことになります．

javac にオプションを付けて問題を解決する方法もありますが，面倒なので，ここでは「VSCode に，拡張子 .java のファイルだけは Shift JIS で保存させる」ことにしましょう（本当はプログラムの出力の文字コードの話もありますが，気にしなくても問題が発生しないのでここでは省略します）．

設定の手順はおおまかには以下の通りです．

1. 「管理」（左の歯車のアイコン） > 「コマンドパレット」 > 「基本設定: 言語固有の設定を構成します...(Preferences: Configure Language Specifig Settings...)」
2. 「言語の選択」 で Java を選ぶ > settings.json というファイルの編集画面になる
3. files.encoding の値を shiftjis にする

文章やスクリーンショットだけで説明するのが難しいので，動画 （学籍番号@mail.ryukoku.ac.jp の Google アカウントでアクセスしてください）にしました． そちらを見ながら設定してね． 設定が正しくできたかどうかは，このページの設定を先へ進めれば確認できます．

Java ソースファイルの新規作成 ＆ Java 用拡張機能のインストール †[edit]

• 「デスクトップ」に Graphics2021 という名前のフォルダ（ディレクトリ）を作り，その中に G01Hello.java という名前の Java ソースファイルを作ります．
• Java プログラミングのための VSCode 拡張機能の設定をします．

(1) デスクトップに Graphics2021 というフォルダを作成．

(2) VSCode で「フォルダを開く」．

「ファイル」 > 「フォルダを開く」（macの場合は 「開く...」） > Graphics2021を指定して「開く」

個々のファイルを開くのではなく，このように「フォルダを開く」を使いましょう．いろいろ便利です．

(3) ファイルを新規作成する．

(4) Java用拡張機能をインストール．

はじめて拡張子 .java のファイルを作成しようとすると，「Java にお勧めの拡張機能をインストールしますか？」というポップアップが出てきます．「インストール」を押しましょう．

上記のようにならなかった場合は，左のアイコン（四角形4つ田で右上のだけ浮いてる） をクリックすると「推奨」のところに Java Extension Pack というのが出ていると思いますので，それを選択して「インストール」を押しましょう．

一部拡張機能の無効化 †[edit]

上記の作業で，「Java Extension Pack」などいくつかの Java プログラミング用拡張機能がインストールされますが，そのうちの「Debugger for Java」を無効化します． 本当は便利なものなのですが，この授業の設定だと初心者の混乱を招きがちなので...．

(1) 以下の手順で「無効にする」をクリック．

(2) ポップアップが出てきて「依存している拡張機能も無効にするか？」と聞かれるので「すべて無効にする」をクリック．

• Debugger for Java に依存している Java Test Runner なども無効化されます．
• 「再読み込みが必要です」と言われるのでクリックして再読み込みしましょう

G01Hello.java を書いてコンパイル＆実行 †[edit]

(1) G01Hello.java を書いて保存．

• 内容は講義資料参照．
  • 「a01055」と「ほげほげお」は，自分の学籍番号と氏名にしてね．
• 以下の画像の (1) のところが次のようになっていることを確認．
  • 実習室Linux または macOS なら UTF-8
  • Windows なら Shift JIS （そうなってない場合は，設定をやり直しましょう）
• 保存は，「ファイル」 > 「保存」 または CTRL+S

(2) ターミナルを開いてコンパイル＆実行．

1. 「ターミナル」 > 「新しいターミナル」 と選択すると，画像の (2) のようにウィンドウが分割されてターミナルが開く．
2. 実習室Linux や macOS では 「bash」または「zsh」となっているところは，Windows では「power shell」となっているでしょう．また，プロンプト（カーソルの前に表示されている文字列）も環境によって異なります．
3. ターミナル内で ls コマンドを実行して， G01Hello.java があることを確認
4. コンパイル

   javac  G01Hello.java

5. コンパイルが成功すると， G01Hello.class という名前のファイル（クラスファイル）ができます
6. 実行

   java  G01Hello