openFrameworksの開発環境構築（msys2 + VSCode + Windows11）

# 概要
　openFrameworks(oF)をVisual Studio Code(VSC)で開発するための、環境整備手順を備忘録としてまとめました。執筆時2023年8月、oFのバージョンは「of_v20230819_msys2_mingw64_release」を利用しています。また、OSはWindows11で利用しています。

　導入時に躓いた点と対処法を記した後、最後に環境整備手順をまとめています。後から参照される方は、最後の章から取り組んでいただければスムーズにインストールできると思います。インストールがうまくいけば、以下画像のようにサンプルのプログラムをVSCから起動することができます。

　ただし、この記事ではプログラムの編集とMake RunReleaseして実行するまでを対象としているため、デバッグその他VSCの便利な機能や、ビルドタスクのjsonファイルについて詳細の言及はありません。その点はご了承ください。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106865/d96bb8e9-3aa7-12f3-8915-ea2a7520aac7.png)

# ビルド環境を決めるまでの経緯
まずはoFのオフィシャルを参照しました。
https://openframeworks.cc/download/
https://openframeworks.cc/setup/vs/
https://openframeworks.cc/setup/msys2/

次に、実際に導入されている方々の記事を読みました。

https://qiita.com/73_ch/items/fa56c951bba0e8218537

https://zenn.dev/kecy/scraps/9dd65f01615bdd

　生憎、Visual Studioは持ってません。大学院で少しだけ使っていたのですが、データ容量やインストールにかかる時間を鑑みて採用はやめました。また、普段使い慣れているVSCで開発したかったこともあり、QtCreaterを新しくインストールすることも、前向きに検討できませんでした。そこで、msys2/MinGW64でビルド環境を作り、これをVSCで利用する環境を構築しようと決めました。


# 遭遇したエラーと対処法

- **oFのライブラリコンパイル失敗**
msys2は「msys2-x86_64-20230718」をダウンロードして、エラーなくインストールできました。一方で、[ドキュメント](https://openframeworks.cc/setup/msys2/)に記載されている「Installing openFrameworks」章で、エラーが出てしまいました。エラーの内容は、パッケージが見つからないとか、ファイルが見つからないとか。

    ドキュメントをよく読むと「As of 0.11.2+, MINGW64 is the recommended flavor to use.」とあります。
msys2でインストールした「MSYS2 MINGW64」で同様にコマンドを叩くことで解決しました。

- **パスの設定**
ドキュメントでは、以下のcmdを打つように書かれていますが、うまく設定されず。
setx PATH "c:\msys64\mingw64\bin;c:\msys64\usr\bin;%PATH%"

    管理者権限でも設定されてなかったようで、Windowsでシステム環境変数の編集を立ち上げ、手打ちしました。

- **インクルードエラー**
VSCでワークスペースをインポートした後、srcフォルダのcppファイルを開くとヘッダーファイルのインクルードでエラーが出ます。うまくパスが通せていないことが原因です。VSCの指示に従って、コンパイラパスおよびソースコードのパスを追記しました。

    ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106865/38e428ed-5a26-22e7-afe0-80dbcf905f1e.png)
    ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106865/7c31bfb6-1674-5d38-4eda-09e780fbc4ac.png)

- **ビルドエラー**
エラーが消えた状態で、Ctrl+Shift+Bを押すとビルドエラーが出現しました。

::: note alert
発生場所 行:1 文字:23
make Debug -j -s 2>&1 || exit 1
                       ~~
トークン '||' は、このバージョンでは有効なステートメント区切りではありません。
    + CategoryInfo          : ParserError: (:) [], ParentContainsErrorRecordException
    + FullyQualifiedErrorId : InvalidEndOfLine

ターミナル プロセス "C:\windows\System32\WindowsPowerShell\v1.0\powershell.exe -Command make Debug -j -s 2>&1 || exit 1" が終了コード 1 で終了しました。 
ターミナルはタスクで再利用されます、閉じるには任意のキーを押してください。 
:::  

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106865/1888994b-9df1-2371-e7ef-2fd19d367a26.png)

oFのフォーラムで検索すると、いくつかの記事を見つけました。

https://forum.openframeworks.cc/t/vscode-with-msys2-mingw64-on-windows-with-guide/40894?utm_source=pocket_saves

https://forum.openframeworks.cc/t/using-of-with-vscode-on-windows/41676?utm_source=pocket_saves

これらのうち、config.makeの修正は効果がありませんでした。
settings.jsonを以下のように修正したところ、無事コンパイルすることができました。

```settings.json
{
    "terminal.integrated.shell.windows": "C:\\msys64\\usr\\bin\\bash.exe", 
    "terminal.integrated.shellArgs.windows": ["--login", "-i"],
    "terminal.integrated.env.windows": { 
        "MSYSTEM": "MINGW64", 
        "CHERE_INVOKING": "1"
    },

    "terminal.integrated.profiles.windows": {
        "PowerShell": {
            "source": "PowerShell",
            "icon": "terminal-powershell"
        },
        "Command Prompt": {
            "path": [
                "${env:windir}\\Sysnative\\cmd.exe",
                "${env:windir}\\System32\\cmd.exe"
            ],
            "args": [],
            "icon": "terminal-cmd"
        },
        "Git Bash": {
            "source": "Git Bash"
        },
        "MSYS2":{
            "path": "C:\\msys64\\usr\\bin\\bash.exe",
            "label": "MSYS2",
            "args": ["--login", "-i"],
            "env": {
                "MSYSTEM": "MINGW64",
                "CHERE_INVOKING": "1",
                "MSYS2_PATH_TYPE": "inherit"
            }
        }
    },
    "terminal.integrated.defaultProfile.windows": "MSYS2",
    "security.workspace.trust.untrustedFiles": "open",
    "cmake.configureOnOpen": true
}
```

諸々のエラーは「ファイルが見つからない」「そんなファイルは存在しない」「そんなコマンドはない」と出ていました。ここから、パスの間違いを疑い、デフォルトのプロジェクトファイルとVSCの設定を直したのが一連の流れです。cmdではなくPowerShellという都合により、VSCの設定が必要でした。MinGW64、コンパイラ、インクルードディレクトリの確認をすることで、対処した次第です。


# 開発環境整備手順まとめ
### Step 1: [msys2 セットアップガイド](https://openframeworks.cc/setup/msys2/)に従い、Mingw64を使用してoFをインストールする

### Step 2: パスを通す（環境変数を設定する）
PATH "c:\msys64\mingw64\bin;c:\msys64\usr\bin;%PATH%"

### Step 3:Mingw64シェルを開き、サンプルフォルダーに移動、コンパイルする
例： cd /C/Users/theo/Downloads/OF/examples/3d/assimpExample 
コンパイルが成功すれば、msys2 / Mingw64 セットアップは正常。

### Step 4:VSCのsettings.jsonを編集して、Mingw64をデフォルトのシェルとして設定

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106865/08126559-0435-2478-4a3f-2e204e6cf079.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106865/b26b4b51-e9e9-32eb-51ca-627c855c5a3f.png)

設定内容は、上記settings.json参照

### Step 5: VSCを再起動し、ワークスペースを開く
開いた直後、コンパイラのパスおよびインクルードパスを設定。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106865/38e428ed-5a26-22e7-afe0-80dbcf905f1e.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/106865/7c31bfb6-1674-5d38-4eda-09e780fbc4ac.png)

### Step 7: 必要に応じ、C++ 拡張機能をインストールする

### Step 8: プロジェクトをビルドする

Ctrl+Shift+B