Visual Studio Code Remote Development(SSH) を使って C++、Java、Python を試してみた

始めに

C++、Java、Python の コーディング ならびに デバック を Visual Studio Code 完結で行う。

あたかも仮想マシン (Ubuntu) で行うように、物理マシン (Windows) で行う。

未経験の言語を試すたび、新しいエディタやデバッグを覚える必要が無くなるかもしれない。

前回の記事では、物理マシンから仮想マシンに接続した。
https://qiita.com/ShinjiSHIBATA/items/51b9efcd5aa0d18583d5

今回の記事では、以下の作業で気付いたことをメモしていきます。

・仮想マシン内にコンパイラ、インタプリタ、デバッガ、フォーマッタをインストールする。

・Visual Studio Code の拡張機能のインストール、設定を行う。

・プログラムを書き、デバッグ実行する。

環境

Windows

Panasonic Let's note CF-SX1GEPDR
Windows 7 Professional Service Pack 1
Intel Core i5-2540M CPU @ 2.60GHz
メモリー 8GB
64bit

Visual Studio Code

バージョン : June 2019 (version 1.36.0) (system setup)

仮想マシン

Oracle VM VirtualBox バージョン 6.0.8 r130520 (Qt5.6.2)
Ubuntu 18.04.2 LTS (Bionic Beaver)

1. 言語のインストール、アンインストールについて

各言語のバージョンは、必要に応じてどのバージョンを利用しても良い。

今入っている言語のバージョンをそのまま使用するなら、それでも良い。

各言語のインストール、アンインストールには様々な手順があり
当記事の記載は、様々な手順の中の一例に過ぎない。

個人的な結論として、Ubuntu では あまり言語をアンインストールすべきではない。

なかでも、Python については Ubuntu の デスクトップ環境で使用されていた歴史があり
アンインストールすることが一般的でない。

その為、各言語の新しいバージョンは必要があった時に、追加でインストールする。

言語のバージョン切り替えは
C++ ならば「sudo update-alternatives --config g++」
Java ならば「sudo update-java-alternatives -s 」があるが
インターネット上の他の情報を参照下さい。

Python ならば Visual Studio Code 上でバージョン切り替えできる。

2. 言語インストール一覧

以降の作業で、仮想マシン (Ubuntu 18.04.2 LTS) にインストールする言語各種の一覧です。

No.	インストール対象	言語	種類	バージョン	ダウンロードファイル名	取得元
1	g++	C++	コンパイラ	7.4.0	(無し)	aptコマンドより
2	gdb	C++	デバッガ	8.1.0.20180409-git	(無し)	aptコマンドより
3	java	Java	OpenJDK	1.8.0_40	openjdk-8u40-b25-linux-x64-10_feb_2015.tar.gz	https://jdk.java.net/java-se-ri/8
4	javac	同上	同上	同上	同上	同上
5	python	Python	インタプリタ	3.7.2	Python-3.7.2.tgz	https://www.python.org/downloads/
6	clang-format	(無し)	フォーマッタ	version 11.0.0	(無し)	aptコマンドより

各言語のバージョンは、必要に応じてどのバージョンを利用しても良い。

ただし、clang-format については、下記のスタイルを利用可能にする為
バージョン11 (clang-format-11) をインストールする。

3. Ubuntu ユーザーディレクトリ を XDGスタイル にする

Ubuntu では 「ダウンロード」など、日本語のディレクトリがデフォルトで存在する。

今回、ブラウザ Firefox を使って、インターネットからバイナリをダウンロードし
バイナリを特定のフォルダに 移動 ならびに 解凍 する。

その時、コマンドが日本語「ダウンロード」よりも英語「Downloads」の方が都合が良い為
XDGスタイル にする。

change_to_XDG_directory_name.sh

LANG=C xdg-user-dirs-update --force

再起動時に該当ディレクトリを XDGスタイル にするか、日本語にするか聞いてくるので
XDGスタイル を選択、「今後聞かない」のチェックボックスをオンにする。

4. フォント

仮想マシン (Ubuntu 18.04.2 LTS) にて端末を起動する。

下記を実行する。

install_font.sh

sudo apt install -y fonts-ricty-diminished

5. ホストOS Visual Studio Code を日本語化する

拡張機能 Japanese Language Pack for Visual Studio Code を 入れる。

Visual Studio Code 画面左部の黒いアクティビティーバーから上から5つ目あたりの
四角に穴があいたような Extentionsボタン (Ctrl + Shift + X) を押す。

Visual Studio Code 画面、左上部「Search Extensions in Marketplace」
と書かれたテキストボックスに「japan」と入力する。

一番目に表示された「Japanese Language Pack for Visual Studio Code」の小さな Install 緑色のボタンを押す。

インストール完了後、Restart Now 青ボタンを押す。

6. g++ (言語インストール一覧 No.1)

6-1. インストール

仮想マシン (Ubuntu 18.04.2 LTS) にて端末を起動する。

下記を実行する。

install_g++.sh

sudo apt install build-essential

6-2. インストール 確認

仮想マシン (Ubuntu 18.04.2 LTS) にて端末を起動する。

下記を実行する。

check_g++_version.sh

which g++
g++ --version

バージョンが表示されれば確認完了。

g++_version

/usr/bin/g++

g++ (Ubuntu 7.4.0-1ubuntu1~18.04.1) 7.4.0
Copyright (C) 2017 Free Software Foundation, Inc.
This is free software; see the source for copying conditions.  There is NO
warranty; not even for MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.

6-3. アンインストール

仮想マシン (Ubuntu 18.04.2 LTS) にて端末を起動する。

下記を実行する。

uninstall_g++.sh

sudo apt remove build-essential

6-4. アンインストール 確認

「6-2. インストール 確認」と同様。

バージョンが表示されなければ確認完了。

7. gdb (言語インストール一覧 No.2)

7-1. インストール

仮想マシン (Ubuntu 18.04.2 LTS) にて端末を起動する。

下記を実行する。

install_gdb.sh

sudo apt install gdb

7-2. インストール 確認

仮想マシン (Ubuntu 18.04.2 LTS) にて端末を起動する。

下記を実行する。

check_gdb_version.sh

which gdb
gdb --version

バージョンが表示されれば確認完了。

gdb_version

/usr/bin/gdb

GNU gdb (Ubuntu 8.1-0ubuntu3) 8.1.0.20180409-git
Copyright (C) 2018 Free Software Foundation, Inc.
License GPLv3+: GNU GPL version 3 or later <http://gnu.org/licenses/gpl.html>
This is free software: you are free to change and redistribute it.
There is NO WARRANTY, to the extent permitted by law.  Type "show copying"
and "show warranty" for details.
This GDB was configured as "x86_64-linux-gnu".
Type "show configuration" for configuration details.
For bug reporting instructions, please see:
<http://www.gnu.org/software/gdb/bugs/>.
Find the GDB manual and other documentation resources online at:
<http://www.gnu.org/software/gdb/documentation/>.
For help, type "help".
Type "apropos word" to search for commands related to "word".

7-3. アンインストール

仮想マシン (Ubuntu 18.04.2 LTS) にて端末を起動する。

下記を実行する。

uninstall_gdb.sh

sudo apt remove gdb

7-4. アンインストール 確認

「7-2. インストール 確認」と同様。

ただし、バージョンが表示されなければ確認完了。

8. javac、java (言語インストール一覧 No.3 No.4)

8-1. インストール

仮想マシン (Ubuntu 18.04.2 LTS) にて Firefox を起動する。

言語インストール一覧にあるURLのWebページを開く。

ここからバイナリをダウンロードする。

「RI Binaries under the Oracle Binary Code License」にて
「Accept License Agreement」のチェックボックスをオンにする。

「Oracle Linux x64 Java Development Kit」のリンクをクリックする。

ダウンロードすると下記のディレクトリに保存される。
/home/<ユーザー名>/Downloads/openjdk-8u40-b25-linux-x64-10_feb_2015.tar.gz

仮想マシン (Ubuntu 18.04.2 LTS) にて端末を起動する。

下記を実行する。

put_jvm.sh

sudo mkdir -p /usr/lib/jvm

cd /usr/lib/jvm

# tar.gz を /usr/lib/jvm に解凍
sudo tar xvzf ~/Downloads/openjdk-8u40-b25-linux-x64-10_feb_2015.tar.gz

cd /etc/alternatives

# java javac の alternatives シンボリックリンク
sudo ln -nfs /usr/lib/jvm/java-se-8u40-ri/bin/java java
sudo ln -nfs /usr/lib/jvm/java-se-8u40-ri/bin/javac javac

cd /usr/bin

# java javac の bin シンボリックリンク
sudo ln -nfs /etc/alternatives/java java
sudo ln -nfs /etc/alternatives/javac javac

# .bashrc の編集
# vi 操作はインターネット上の他の情報を参照下さい。
vi ~/.bashrc

# vi で 末尾 に以下の4行を追記。(コメントの#は消して追記下さい)
#JAVA_HOME=$(readlink -f /usr/bin/javac | sed "s:/bin/javac::")
#export JAVA_HOME
#PATH=$PATH:$JAVA_HOME/bin
#export PATH

# vi で追記の保存が完了したら実行
source ~/.bashrc

8-2. インストール 確認

仮想マシン (Ubuntu 18.04.2 LTS) にて端末を起動する。

下記を実行する。

check_java_javac_version.sh

which java
java -version

which javac
javac -version

バージョンが表示されれば確認完了。

java_javac_version

/usr/bin/java

openjdk version "1.8.0_40"
OpenJDK Runtime Environment (build 1.8.0_40-b25)
OpenJDK 64-Bit Server VM (build 25.40-b25, mixed mode)

/usr/bin/javac

javac 1.8.0_40

8-3. アンインストール

バイナリのファイル群をフォルダに置く形式の為、アンインストールは不要。

必要に応じて、/usr/bin ならびに /etc/alternatives の
シンボリックリンクの 更新 または unlink を実施。

9. python (言語インストール一覧 No.5)

インストール については
python japan の 環境構築ガイド「Ubuntu環境のPython」を参照下さい。
https://www.python.jp/install/ubuntu/index.html

9-1. インストール 確認

仮想マシン (Ubuntu 18.04.2 LTS) にて端末を起動する。

下記を実行する。

check_python_version.sh

which python3
python3 --version

バージョンが表示されれば確認完了。

python_version

/usr/local/bin/python3

Python 3.7.2

9-2. 数値解析ソフトウェア SciPy サイパイ インストール

NumPy ナンパイも一緒にインストールされる。

install_scipy.sh

pip3 install scipy

10. clang-format (言語インストール一覧 No.6)

10-1. インストール

仮想マシン (Ubuntu 18.04.2 LTS) にて端末を起動する。

下記を実行する。

install_clang-format.sh

sudo vi /etc/apt/sources.list

# vi で 末尾 に以下の2行を追記。(コメントの#は消して追記下さい)
# deb http://apt.llvm.org/bionic/ llvm-toolchain-bionic main
# deb-src http://apt.llvm.org/bionic/ llvm-toolchain-bionic main

# パッケージを更新
sudo apt update

# 失敗する
# Googleで検索「ubuntu sudo apt-key adv」
# sudo apt-key adv --keyserver keyserver.ubuntu.com --recv-keys 15CF4D18AF4F7421
# sudo apt update

sudo apt install clang-format-11

cd /usr/bin

# clang-format の bin シンボリックリンク

# clang-format の apt install を 実行した時に clang-format-11 にリンクされている
#sudo ln -nfs ../lib/llvm-11/bin/clang-format clang-format-11

# clang-format-11 を clang-format として実行できるようにする
sudo ln -nfs clang-format-11 clang-format

10-2. インストール 確認

仮想マシン (Ubuntu 18.04.2 LTS) にて端末を起動する。

下記を実行する。

check_clang-format_version.sh

which clang-format
clang-format --version

バージョンが表示されれば確認完了。

clang-format_version

/usr/bin/clang-format

clang-format version 11.0.0-++20200207101852+81c9df10231-1~exp1~20200207092452.1488

10-3. アンインストール

仮想マシン (Ubuntu 18.04.2 LTS) にて端末を起動する。

下記を実行する。

uninstall_clang-format.sh

sudo apt remove clang-format-11

10-4. アンインストール 確認

「10-2. インストール 確認」と同様。

ただし、バージョンが表示されなければ確認完了。

11. 拡張機能一覧

以降の作業で、仮想マシン (Ubuntu 18.04.2 LTS) にインストールする Visual Studio Code 拡張機能の一覧。

後述の「12. workspace 作成」にて、対象が「○」となっている拡張機能をインストールする。

No.	対象	論理名	物理名
1	○	Bash Beautify	shakram02.bash-beautify
2	○	Bash Debug	rogalmic.bash-debug
3	○	Bracket Pair Colorizer	coenraads.bracket-pair-colorizer
4	○	C/C++	ms-vscode.cpptools
5	○	C#	ms-dotnettools.csharp
6	○	Clang-Format	xaver.clang-format
7		Debugger for Java	vscjava.vscode-java-debug
8	○	Japanese Language Pack for Visual Studio Code	ms-ceintl.vscode-language-pack-ja
9		Java Dependency Viewer	vscjava.vscode-java-dependency
10	○	Java Extension Pack	vscjava.vscode-java-pack
11		Java Test Runner	vscjava.vscode-java-test
12		Language Support for Java(TM) by Red Hat	redhat.java
13	○	Markdown PDF	yzane.markdown-pdf
14		Maven for Java	vscjava.vscode-maven
15	○	Python	ms-python.python
16	○	Rech COBOL	rechinformatica.rech-editor-cobol
17	○	Save and Run	wk-j.save-and-run
18	○	snippet-factory	haydn.snippet-factory
19	○	VB.NET Grammars and Snippets	gordonwalkedby.vbnet
20		Visual Studio IntelliCode	visualstudioexptteam.vscodeintellicode

以上の拡張機能については、以降の作業が完了した時の全ての拡張機能。

対象が「○」となっていない拡張機能は、対象が「○」となっている拡張機能と同時にインストールされる。

拡張機能をインストールすると、青色の「再読み込みが必要です」ボタンが表示される。

都度「再読み込みが必要です」ボタンを押す。

12. workspace 作成

Visual Studio Codeを起動する。

Visual Studio Code 画面、左部の黒いアクティビティーバーから上から6つ目あたりの
モニターのような Remote-SSH ボタンを押す。

サイドバーの CONNECTIONS に、<ユーザー名>-VirtualBox が表示される。

<ユーザー名>-VirtualBox の右の +マーク のような Connect to Host in New Window ボタンを押す。

仮想マシンへの接続が完了する。

Ctrlキーを押しながら＠キーを押す。

画面中央下部、パネルにターミナルが初期表示される。

ターミナルにて、以下のコマンドを実行する。

create_workspace.sh

#workspace 作成
#/home/<ユーザー名>/workspace/Main
mkdir -p ~/workspace/Main

#binフォルダ 作成　(C++をビルドした時、実行ファイルを格納するフォルダ)
#/home/<ユーザー名>/workspace/Main/bin
mkdir -p ~/workspace/bin

#プログラムファイル 作成　(先頭1文字の > も コマンドの一部の為、そのまま入力)
> ~/workspace/Main/a.cpp
> ~/workspace/Main/a.py
> ~/workspace/Main/Main.java

#フォーマッタ設定ファイル 作成　(先頭1文字の > も コマンドの一部の為、そのまま入力)
> ~/workspace/.clang-format

画面上部、メニューより [ファイル]-[フォルダーをワークスペースに追加]を選択。

画面上中央部に表示されるテキストボックスに以下を入力。
「/home/<ユーザー名>/workspace/」

追加したフォルダが、サイドバーに表示される。

拡張機能一覧にて、対象が「○」となっている拡張機能をインストールする。

アクティビティーバー、上から5つめの拡張機能をクリック。

「Marketplace で拡張機能を検索する」のテキストボックスに、拡張機能一覧の論理名を入力。

候補として絞られた一覧から、拡張機能一覧と同名の拡張機能の緑色の「インストール」をクリック。

インストール後、青色の「再読み込みが必要です」をクリック。

拡張機能のインストールがすべて完了した後、Ctrlキーを押しながら カンマ (,) キーを押す。

設定タブが表示される。

分かりにくいが、設定タブの設定の文字があるところを右に見ていくと
ファイルの左肩に矢印の付いたボタン (= 設定 (JSON) を開くボタン)がある。

設定 (JSON) を開くボタンを押す。

settings.json というファイルが開く。

既存の設定を消した上で、以下の設定を貼り付ける。

settings.json

{
    "[COBOL]": {
        "files.encoding": "shiftjis"
    },
    "[cpp]": {
        "editor.defaultFormatter": "xaver.clang-format"
    },
    "[java]": {
        "editor.defaultFormatter": "xaver.clang-format"
    },
    "[javascript]": {
        "editor.defaultFormatter": "vscode.typescript-language-features"
    },
    "C_Cpp.suggestSnippets": false,
    "editor.codeLens": false,
    "editor.fontFamily": "Ricty Diminished",
    "editor.formatOnPaste": true,
    "editor.formatOnSave": true,
    "editor.formatOnType": true,
    "editor.renderWhitespace": "all",
    "editor.snippetSuggestions": "top",
    "editor.suggestSelection": "first",
    "files.associations": {
        "*.vb": "vbnet",
        "*.cob": "COBOL"
    },
    "java.errors.incompleteClasspath.severity": "ignore",
    "keyboard.dispatch": "keyCode",
    "markdown-pdf.footerTemplate": "<div style=\"position: relative; border-top: 1px; margin: 0.5cm; font-size: 9px; width: 100%;\"><div style=\"position: absolute; width: 100%; top: 0.2cm; text-align: center;\"><span class='pageNumber'></span> / <span class='totalPages'></span></div></div>",
    "markdown-pdf.margin.right": "0cm",
    "markdown-pdf.margin.left": "0cm",
    "markdown.preview.breaks": true,
    "markdown.preview.fontFamily": "Ricty Diminished",
    "python.formatting.provider": "autopep8",
    "python.jediEnabled": false,
    "python.linting.flake8Enabled": true,
    "python.linting.lintOnSave": true,
    "python.linting.pylintEnabled": false,
    "saveAndRun": {
        "commands": [
            {
                "match": "a\\.vb$",
                "cmd": "${workspaceFolder}/remove_space_vb",
                "useShortcut": false,
                "silent": false
            },
            {
                "match": "a\\.cob$",
                "cmd": "${workspaceFolder}/remove_space_cob",
                "useShortcut": false,
                "silent": false
            }
        ]
    },
    "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
    "window.zoomLevel": 0,
    "workbench.editor.enablePreview": false,
    "workbench.startupEditor": "newUntitledFile"
}

Ctrlキーを押しながらSを押して、保存。

Ctrlキーを押しながら、Shiftキーを押しながら、Pを押すと、コマンドを入力する子画面が表示される。

このコマンドを入力する子画面をコマンドパレットと呼ぶ。

コマンドパレットに「C++ config」と入力して表示された候補から、「C/C++:Edit Configurations (JSON)」を選択。

c_cpp_properties.json というファイルが開く。

既存の設定を消した上で、以下の設定を貼り付ける。

c_cpp_properties.json

{
    "configurations": [
        {
            "name": "Ubuntu c++14",
            "compilerPath": "/usr/bin/gcc",
            "cppStandard": "c++14"
        }
    ],
    "version": 4
}

Ctrlキーを押しながらSを押して、保存。

Ctrlキーを押しながら、Shiftキーを押しながら、Pを押す。

コマンドパレットに「task config」と入力して表示された候補から、「Tasks: Configure Task」を選択。

「テンプレートから tasks.json を生成」を選択。

「Others」を選択。

tasks.json というファイルが開く。

既存の設定を消した上で、以下の設定を貼り付ける。

tasks.json

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "c++14 build",
            "type": "shell",
            "command": "g++",
            "args": [
                "-g",
                "-std=gnu++1y",
                "-O0",
                "-o",
                "${workspaceFolder}/bin/a.out",
                "${workspaceFolder}/Main/a.cpp"
            ],
            "group": {
                "kind": "build",
                "isDefault": true
            }
        }
    ]
}

Ctrlキーを押しながらSを押して、保存。

Ctrlキーを押しながら、Shiftキーを押しながら、Pを押す。

コマンドパレットに「launch」と入力して表示された候補から、「Debug: Open launch json」を選択。

このタイミングで、メッセージ一覧の No.4 が発生する。

青色の「Exclude in workspace」ボタンを押す。

このメッセージが発生した場合、もう一度コマンドパレットに「launch」と入力するところからやり直す。

いずれを開いても大丈夫だが、「C++(GDB/LLDB)」を選択。

launch.json というファイルが開く。

既存の設定を消した上で、以下の設定を貼り付ける。

launch.json

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "cppdbg",
            "name": "C++",
            "request": "launch",
            "program": "${workspaceFolder}/bin/a.out",
            "cwd": "${workspaceFolder}",
            "externalConsole": false,
            "MIMode": "gdb",
            "preLaunchTask": "c++14 build",
            "setupCommands": [
                {
                    "text": "-enable-pretty-printing",
                    "description": "enable pretty printing",
                    "ignoreFailures": true
                }
            ]
        },
        {
            "type": "java",
            "name": "Java",
            "request": "launch",
            "mainClass": "Main",
            "console": "integratedTerminal"
        },
        {
            "type": "python",
            "name": "Python",
            "request": "launch",
            "program": "${workspaceFolder}/Main/a.py",
            "console": "integratedTerminal"
        }
    ]
}

Ctrlキーを押しながらSを押して、保存。

Ctrlキーを押しながら、Shiftキーを押しながら、Pを押す。

コマンドパレットに「keyboard」と入力して表示された候補から、「Preferences: Open Keyboard Shortcuts (JSON)」を選択。

keybindings.json というファイルが開く。

既存の設定を消した上で、以下の設定を貼り付ける。

keybindings.json

[
    {
        "key": "ctrl+j ctrl+x",
        "command": "java.clean.workspace"
    },
    {
        "key": "ctrl+;",
        "command": "workbench.action.terminal.focus",
        "when": "editorTextFocus"
    },
    {
        "key": "ctrl+;",
        "command": "workbench.action.focusFirstEditorGroup",
        "when": "terminalFocus"
    }
]

Ctrlキーを押しながらSを押して、保存。

Ctrlキーを押しながらPを押すと、ファイル名を入力する子画面が表示される。

このファイル名を入力する子画面をクイックオープンウィンドウと呼ぶ。

クイックオープンウィンドウに「.clang-format」と入力する。

表示された「.clang-format」を選択。

以下の設定を貼り付ける。

.clang-format

Language: Cpp
BasedOnStyle: LLVM
IndentWidth: 4
AllowShortFunctionsOnASingleLine: None
BreakConstructorInitializers: BeforeComma
BreakInheritanceList: BeforeComma
IndentCaseLabels : true
IndentPPDirectives: BeforeHash
IndentWrappedFunctionNames: true
KeepEmptyLinesAtTheStartOfBlocks: false
PointerAlignment: Left
SpaceAfterLogicalNot : false
SpaceAfterTemplateKeyword: false
SpaceBeforeCpp11BracedList: true
SpaceBeforeInheritanceColon: true
SpaceBeforeParens: NonEmptyParentheses
SpaceBeforeRangeBasedForLoopColon: true
SpacesInContainerLiterals: true
---
Language: Java
BasedOnStyle: LLVM
IndentWidth: 4
AllowShortFunctionsOnASingleLine: None
BreakConstructorInitializers: BeforeComma
BreakInheritanceList: BeforeComma
IndentCaseLabels : true
IndentPPDirectives: BeforeHash
IndentWrappedFunctionNames: true
KeepEmptyLinesAtTheStartOfBlocks: false
PointerAlignment: Left
SpaceAfterLogicalNot : false
SpaceAfterTemplateKeyword: false
SpaceBeforeCpp11BracedList: true
SpaceBeforeInheritanceColon: true
SpaceBeforeParens: NonEmptyParentheses
SpaceBeforeRangeBasedForLoopColon: true
SpacesInContainerLiterals: true

「.clang-format」は、空行厳禁。

一番最後の：true の後に改行を入れない。

あと、複数の Language を指定する時、Language の仕切りとして「---」の行を入れる。

Ctrlキーを押しながらSを押して、保存。

画面上部、メニューより [ファイル]-[名前を付けてワークスペースを保存]を選択。

デフォルトでは
「/home/<ユーザー名>/workspace/.code-workspace」

これを
「/home/<ユーザー名>/workspace/.vscode/.code-workspace」とする。

OKボタンを押す。

次回から、ワークスペースを開く時は
画面上部、メニューより [ファイル]-[ワークスペースを開く]

以下を入力する。
「/home/<ユーザー名>/workspace/.vscode/.code-workspace.code-workspace」

OKボタンを押す。

13. C++ 標準入出力 デバッグ

アクティビティバーからファイルマークのエクスプローラを押す。

サイドバーのワークスペースから、a.cppをクリックして、a.cppを開く。

以下のプログラムを貼り付ける。

a.cpp

#include <bits/stdc++.h>

using namespace std;

int main() {
    const int interval = 32;
    char      c[101];

    cin >> c;

    // 26 Characters A-Z    65-90
    // Between 6 Characters 91-96 [  \  ]  ^  _  `
    // 26 Characters a-z    97-122

    if ('a' <= c[0] && c[0] <= 'z') c[0] = c[0] - interval;

    cout << c << endl;

    // environment dependent
    // preprocessor defines
    // __GNUC__            = major version
    // __GNUC_MINOR__      = minor version
    // __GNUC_PATCHLEVEL__ = patch level

#ifdef __GNUC__
    cout << __GNUC__ << "." << __GNUC_MINOR__;
    #ifdef __GNUC_PATCHLEVEL__
    cout << "." << __GNUC_PATCHLEVEL__;
    #endif
    cout << endl;
#endif

    return 0;
}

Ctrlキーを押しながらSを押して、保存。

適当に無駄なスペースを入れて保存。

無駄なスペースが消されるなどフォーマット機能が働いていることを確認。

変数名をわざと間違える。

赤い下線が表示されるなど、シンタックスチェックが働いていることを確認。

間違えた変数名を元に戻す。

17行目「cout << c << endl」の 左の 17 という行番号の少し左をクリック。

赤丸がつく。ブレイクポイント。

Ctrlキーを押しながら、Shiftキーを押しながら、Dを押す。

画面左上部、サイドバー、ドロップダウンから「C++ (workspace)」を選択。

「C++ (workspace)」の左に緑色の三角 (= デバッグの開始) を押す。

画面中央下部のパネルのうち、「デバッグコンソール」タブが選択表示される。

「デバッグコンソール」タブの右横、「ターミナル」タブを選択する。

カーソルが止まって表示される。

標準入力待ちとなっており、ここで小文字で 「c++」 と入力し、Enterキーを押す。

ブレイクポイントにカーソルが止まる。

サイドバーに変数 c : [101] と表示されている箇所をクリック。

char配列の内容が表示される。

そのままF5キー (=続行) を押す。

ターミナルに結果が表示される。

a_cpp_result

C++
7.4.0

このプログラムでは、標準入力の1文字目を大文字に変換し表示。

その次の行に、C++のバージョンを表示。

バージョンの部分、言語インストール一覧の No.1 g++ のバージョンと一致していることを確認。

C++の標準入出力とデバッグが完了。

14. Java 標準入出力 デバッグ

アクティビティバーからファイルマークのエクスプローラを押す。

サイドバーのワークスペースから、Main.java をクリックして、Main.java を開く。

Java Overview など Main.java 以外のタブを閉じる。

拡張機能が立ち上がるのに、やや時間がかかる。

画面右下部に Facebook の いいね のような 親指立てているアイコンが表示されたら、拡張機能が立ち上がったと思ってよい。

以下のプログラムを貼り付ける。

Main.java

import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStreamReader;
import java.io.PrintWriter;

public class Main {
    public static void main (String[] args) throws IOException {
        final String s;

        try (BufferedReader reader =
                 new BufferedReader (new InputStreamReader (System.in))) {
            s = reader.readLine();
        }

        PrintWriter out = new PrintWriter (System.out);

        String word = s;

        word = word.substring (0, 1).toUpperCase() + word.substring (1);

        out.println (word);

        out.println (System.getProperty ("java.version"));

        out.flush();
    }
}

Ctrlキーを押しながらSを押して、保存。

適当に無駄なスペースを入れて保存。

無駄なスペースが消されるなどフォーマット機能が働いていることを確認。

変数名をわざと間違える。

赤い下線が表示されるなど、シンタックスチェックが働いていることを確認。

間違えた変数名を元に戻す。

特にまったくの初回は、フォーマット機能やシンタックスチェックが働かないことがある。

その場合は、以下の順で事象が解消されるか試す。
・Main.java のタブを閉じて開き直す。
・後述の「デバッグ 注意事項」に従って、Java の workspace を clean する。
・Visual Studio Code を再起動する。

おおよそ以上で解消されることが多いが、解消されない場合、これまでの設定を間違えている可能性がある。

21行目「out.println (word)」の 左の 21 という行番号の少し左をクリック。

赤丸がつく。ブレイクポイント。

Ctrlを押しながら、Shiftを押しながら、Dを押す。

画面左上部、ドロップダウンから「Java (workspace)」を選択。

「Java (workspace)」の左の緑色の三角 (= デバッグの開始) を押す。

画面中央下部のパネルのうち、「ターミナル」タブが選択表示される。

「ターミナル」タブで、カーソルが止まって表示されている。

標準入力待ちとなっており、ここで小文字で 「java」 と入力し、Enterキーを押す。

ブレイクポイントにカーソルが止まる。

サイドバーに変数 word : "Java" と表示されている。

そのままF5キー (=続行) を押す。

ターミナルに結果が表示される。

Main_java_result

Java
1.8.0_40

このプログラムでは、標準入力の1文字目を大文字に変換し表示。

その次の行に、Javaのバージョンを表示。

バージョンの部分、言語インストール一覧の No.3 java ならびに No.4 javac のバージョンと一致していることを確認。

Java の標準入出力とデバッグが完了。

15. Python 標準入出力 デバッグ

アクティビティバーからファイルマークのエクスプローラを押す。

サイドバーのワークスペースから、a.py をクリックして、a.py を開く。

以下の操作のなかで、flake8 と autopep8 のインストールを促すメッセージが表示されたら
青色の「Install」ボタンを押す。

拡張機能が立ち上がるのに、やや時間がかかる。

左下に Python のバージョンが表示されたら、拡張機能が立ち上がったと思ってよい。

以下のプログラムを貼り付ける。

a.app

import sys
word = input().capitalize()
print(word)
print(sys.version_info)

Ctrlキーを押しながらSを押して、保存。

適当に無駄なスペースを入れて保存。

無駄なスペースが消されるなどフォーマット機能が働いていることを確認。

変数名をわざと間違える。

赤い下線が表示されるなど、シンタックスチェックが働いていることを確認。

間違えた変数名を元に戻す。

4行目、「print(sys.version_info)」 にて、先頭に「#」を入れコメントアウト。

1行目、不要なimportで赤い下線が表示され、コーディング規約チェックが働いていることを確認。

4行目、先頭の「#」を外す。

特にまったくの初回は、フォーマット機能やシンタックスチェックが働かないことがある。

その場合は、以下の順で事象が解消されるか試す。
・a.py のタブを閉じて開き直す。
・後述の「デバッグ 注意事項」に従って、Java の workspace を clean する。
・Visual Studio Code を再起動する。

おおよそ以上で解消されることが多いが、解消されない場合、これまでの設定を間違えている可能性がある。

3行目「print(word)」の 左の 3 という行番号の少し左をクリック。

赤丸がつく。ブレイクポイント。

Ctrlを押しながら、Shiftを押しながら、Dを押す。

画面左上部、ドロップダウンから「Python Current (workspace)」を選択。

「Python Current (workspace)」の左の緑色の三角 (= デバッグの開始) を押す。

画面中央下部のパネルのうち、「ターミナル」タブが選択表示される。

「ターミナル」タブで、カーソルが止まって表示されている。

標準入力待ちとなっており、ここで小文字で 「python」 と入力し、Enterキーを押す。

ブレイクポイントにカーソルが止まる。

サイドバーに変数 word : "Python" と表示されている。

そのままF5キー (=続行) を押す。

ターミナルに結果が表示される。

a_py_result

Python
sys.version_info(major=3, minor=7, micro=2, releaselevel='final', serial=0)

このプログラムでは、標準入力の1文字目を大文字に変換し表示。

その次の行に、Pythonのバージョンを表示。

バージョンの部分、言語インストール一覧の No.5 python のバージョンと一致していることを確認。

Python の標準入出力とデバッグが完了。

16. デバッグ 注意事項

Javaのデバッグ実行を正常終了し、次にC++をデバッグ実行すると、Visual Studio Code が 無応答になる。

対処方法として、java.clean.workspace を実行するキーボードショートカットを利用して
Java の workspace を clean する。

これにより、C++のデバッグが引き続き可能になる。

java.clean.workspace　の キーボードショートカットを
この記事では Ctrl キーを押しながら、J と X を順に押すものとして設定している。

17. メッセージ一覧

Visual Studio Code で見かけた メッセージ の 一覧。

設定を完了していれば、見かけることは無いかもしれない。

しかしながら、メッセージへの対応によっては experience (感動体験) が変わることもあると思う。

すべての設定を終えた今だったら、こう対応するというのをまとめた。

No.	メッセージ	メッセージに対する対処 (ボタン)
1	Are you sure you want to clean the Java language server workspace?	Restart and delete
2	Classpath is incomplete. Only syntax errors will be reported.	Don't Show Again
3	Could not establish connection to "<ユーザー名>-VirtualBox"	Retry
4	Do you want to exclude the VS Code Java project settings files (.classpath, .project. .settings, .factorypath) from the file explorer?	Exclude in workspace
5	Formatter autopep8 is not installed. Install?	Yes
6	Help improve VS Code by allowing Microsoft to collect usage data. Read our privacy statement and learn how to opt out.	×ボタン
7	In order to use VS Code in Japanese, VS Code needs to restart.	Restart Now
8	Linter flake8 is not installed.	Install
9	Tip: you can change the Python interpreter used by the Python extension by clicking on the Python version in the status bar	Got it!
10	このファイルの種類には拡張機能 'C/C++' が推奨されます。	Install
11	このファイルの種類には拡張機能 'Python' が推奨されます。	Install
12	このファイルの種類には拡張機能パック 'Java' が推奨されます。	Install
13	この大規模なワークスペースでファイルの変更をウォッチすることができません。この問題を解決するには、手順のリンクに従ってください。	通知右上、歯車マーク、今後通知しない
14	申し訳ございません。Python の IntelliCode サポートのアクティブ化で問題が発生しました。詳細については、"Python" および "VS IntelliCode" の出力ウィンドウをご確認ください。	×ボタン、初回セットアップ時に発生する。一旦、Visual Studio Codeの再起動することで解消される。

終わりに

始めに想像していたよりも、設定が大変だったが、設定さえ十分に行うことが出来れば、Visual Studio Code の使用感はとても良い。

Visual Studio Code には数多くの拡張機能があり、その組み合わせでいろいろなことができる可能性がある。

Ubuntu の 言語のインストールには苦労した。

Ubuntu の パッケージマネージャ apt はとても良いが、apt コマンドがすんなり通らない場合、さまざまな対応が考えられる。

言語のバイナリではなく、ソースコードを手に入れて、自分でビルドしたものを apt 管理するのが究極の理想と考える。

関心は尽きないが、それを実行する時間と体力もない為、このあたりで終わりにしたい。

ひとつおすすめしておきたいことがある。

当記事の「インストール 確認」を最初に実行し、まずはどのバージョンが入っているのか、入っていないのか確認することである。

もし、これまでの設定より良い設定があったら、この記事を更新していきたい。