LoginSignup
3

More than 3 years have passed since last update.

競プロ用のVSCode環境設定(Win&Mac併用)

Last updated at Posted at 2019-10-15

0. はじめに

本記事の対象者は以下を想定しています。

  • 競プロに興味があるのでC++の開発環境を構築したい。
  • WindowsとMacで同様の開発環境を手に入れたい。
  • Visual Studio Code(通称:VSCode)を使ってみたい。

1. 必要なソフトウェアの導入

1.1. 以下サイトからVSCodeをダウンロードする。
https://code.visualstudio.com/download

1.2. ダウンロードしたVSCodeを起動する。
※Macでは以下のように表示され、起動できない場合がある。
スクリーンショット 2019-10-16 0.28.04.png
起動するためには「システム環境設定」>「セキュリティとプライバシー」から「このまま開く」ボタンを押す。
スクリーンショット 2019-10-16 0.28.45.png

2. VSCodeで拡張機能の導入

本稿ではC++の開発環境を構築するため、以下の拡張機能を導入する。

  • C/C++ (必須)
  • CodeLLDB (Macのみ推奨:vector型などの内部の値をデバッグするために必要)
  • indent-rainbow (任意:インデントに色を付ける)
  • Japanese Language Pack (任意:VSCodeを日本語化する) スクリーンショット 2019-10-16 1.24.10.png

※Windowsの場合、mingw-w64 (Linux標準のC/C++コンパイラをWindows上で動かすツール) をインストールする。
ご参考: https://qiita.com/yut-nagase/items/9bb65481685f6b8002de

※Macの場合、C/C++拡張機能をインストールすると以下画面が表示されるので、clang (gcc互換のC/C++コンパイラ) をインストールする。
スクリーンショット 2019-10-16 0.33.13.png

3. VSCodeワークスペースの導入

3.1. Win&Mac併用のVSCodeワークスペースを取得する。
https://1drv.ms/u/s!AgYlW9NKJ6gjjD7dbGCgjjm3xALW?e=MnCeQ2
スクリーンショット 2019-10-16 1.47.59.png
3.2. ZIPファイル解凍する。(Macの場合はダウンロードと同時に解凍されるため不要)
3.3. VSCodeを起動し、メニューから「ファイル」> 「ワークスペースを開く」を選択する。
スクリーンショット 2019-10-16 1.50.23.png
3.4. ワークスペースに含まれる「vs.code-workspace」を指定する。
スクリーンショット 2019-10-16 1.53.30.png
3.5. 以下のようにワークスペースが開かれる。
スクリーンショット 2019-10-16 1.54.42.png

4. 【Macのみ】 bits/stdc++.h を導入

4.1. Macの場合、「bits/stdc++.h」という全てのヘッダーファイルを一括includeするものが含まれない。この問題を解決するため、以下からヘッダーファイルを取得する。
https://gist.github.com/reza-ryte-club/97c39f35dab0c45a5d924dd9e50c445f
4.2. 上記の「Raw」ボタンを右クリックし、「リンク先のファイルをダウンロード」を選択する。
スクリーンショット 2019-10-16 0.44.19.png
4.3. Launchpadを起動し、「その他」>「コンソール」を起動する。
4.4. コンソールに以下コマンドを入力する。
※sudoコマンド入力時にパスワードが必要になる。

cd /Library/Developer/CommandLineTools/usr/include/c++/v1/
sudo mkdir bits
cd bits
sudo cp /Users/【ユーザー名】/Downloads/stdc++.h .

5. 【Winのみ】VSCodeのコンパイラの実行パスを修正

5.1. VSCodeのワークスペースを開き、「.vscode」> 「c_cpp_properties.json」を開く。
5.2. Win32の「compilerPath」をmingw-w64のインストール先に変更する。
スクリーンショット 2019-10-16 2.29.05.png

6. C++ソースコードをコンパイル&実行

6.1. ワークスペースに含まれる「abc001a.cpp」をクリックする。
スクリーンショット 2019-10-16 3.10.38.png
6.2. VSCodeの左側の虫アイコンをクリックし、デバッグ画面にする。
スクリーンショット 2019-10-16 3.11.30.png
6.3. デバッグの初期設定は「Launch(Win)」になっている。Macの場合、「Launch(Mac)」に変更する。
6.4. デバッグ右の再生ボタンをクリックする。
6.5. 下のタブを「ターミナル」に切り替え、以下文字を入力してEnterキーを押す。

1 3

6.6. 「1 - 3」の演算結果である「-2」が出力される。
スクリーンショット 2019-10-16 3.12.13.png
以上で設定完了です。

7. おわりに

簡単に説明するため、VSCodeの詳しい設定などは省いています。
自分なりに使いやすい設定を見つけて、快適な競プロ生活を楽しんでください。

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3