Processing2 + vs code の環境構築 備忘録

#初めに
これは完全に備忘録
windows10上での話。


大学院の授業で、Processing2を使うことになったのだが、これが、まぁ使いにくい。
授業の内容は結構面白い(フラクタルやカオスについてなど)が、課題でProcessing2を使用して色々やれと言われたが、元々患っていたIDEアレルギーもあって、課題をやりたくない。実際今も、明日昼までの課題についてほぼ手を付けていない。
（初めてプログラムに触れたのが、Arduino（中身はProcessing）だったが、今あの環境でコード書くのはしんどい。）

このままでは落単してしまうので、いつも使用しているVSCodeで、processing2を動かせるようにした。

以下のサイトを参考にVSCodeを改造したが、躓いたところがあったので、メモとしてこの記事を残す。

#参考サイト

全体の流れは、以下のサイトを参考に行った。
[参考サイト１](https://qiita.com/jacynthe/items/d31eaa77496295c10556)
[参考サイト２](http://mslabo.sakura.ne.jp/WordPress/make/processing%E3%80%80%E9%80%86%E5%BC%95%E3%81%8D%E3%83%AA%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9/visual-studio-code%E3%81%A7processing%E3%82%92%E6%A5%BD%E3%81%97%E3%82%80%E3%81%AB%E3%81%AF/)
[参考サイト３](https://qiita.com/nisunisu/items/6e34d483bcefb7604617)
体感的には、参考サイト２が特に丁寧に書かれていた。

なお、あらかじめ、Processing2はインストールされているものとする。
（インストールフォルダの中にある、__"processing-java.exe"__が必要。）

具体的に行った作業は、
1. VSCodeに"Processing Language "を入れる。
2. Processingのビルドタスクを楽に実行するために、"tasks.json"をいじる。 

メインの作業は、"tasks.json"をいじることだが、具体的な内容は、参考サイトを参照せよ。
結果作成したのが以下。

```json:参考サイトをベースに作成したが、失敗してしまった"tasks.json"
{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Run Processing Sketch", // わかりやすい名前を付ける
      "windows": {
        "command": "C:\\Program Files\\processing-2.2.1\\processing-java.exe", // ここのパスはご自身の環境に合わせてください
      },
      "type": "process",
      "args": [
        "--force",
        "--sketch=${fileDirname}", // スケッチのフォルダまで指定する。ファイルは指定しない。
        "--run"
      ],
      "group": {
        "kind": "build", // Ctrl+Shift+Bで実行したい(=楽したい)のでbuildにする
        "isDefault": true
      },
      "presentation": {
        "reveal": "always", // 画面表示を常に行う
        "panel": "new"      // 新しいterminalで実行する
      }
    }
  ]
}
```

#上記参考サイトだけでは解決できなかった問題とその解決
なんか、こんなエラーコードが出た。
以下のエラーコードは、sample2.pdeを実行しようとしたときのもの。
(processingの注意点として、同盟フォルダの中にソースファイルを置いておく必要がある。
(例：sample2の中にsample2.pde))

```:上記"tasks.josn"で実行したときのエラーコード
An output path must be specified.
ターミナル プロセス "C:\Program Files\processing-2.2.1\processing-java.exe '--force', '--sketch=C:\Users\[sample2.pdeがあるフォルダまでのpath]\sample2', '--run'" が起動に失敗しました (終了コード: 1)。
```

出力はどこ？と怒られた。
なんやかんや調べると、[このサイト](https://hoshi-sano.hatenablog.com/entry/2013/08/01/213236)に出会ったので、これを参考に以下の1行を加えた。

```json:成功した"tasks.json"
{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Run Processing Sketch", // わかりやすい名前を付ける
      "windows": {
        "command": "C:\\Program Files\\processing-2.2.1\\processing-java.exe", // ここのパスはご自身の環境に合わせてください
      },
      "type": "process",
      "args": [
        "--force",
        "--sketch=${fileDirname}", // スケッチのフォルダまで指定する。ファイルは指定しない。
        "--output=${fileDirname}\\output", //付け加えた1行
        "--run"
      ],
      "group": {
        "kind": "build", // Ctrl+Shift+Bで実行したい(=楽したい)のでbuildにする
        "isDefault": true
      },
      "presentation": {
        "reveal": "always", // 画面表示を常に行う
        "panel": "new"      // 新しいterminalで実行する
      }
    }
  ]
}
```

これをもとにビルドを実行すると、スケッチのフォルダの中に、"output"というフォルダが作成され、.pdeファイルは実行される。

イメージ例（[このサイト参考](https://qiita.com/paty-fakename/items/c82ed27b4070feeceff6)）
sample2
├sample2.pde//ソース
└output//生成されたフォルダ
　└生成されたよくわからないもの

__なぜ、参考サイトの方法では、processingが動かなかったのか__
推測の域を出ないが、多分、processingのバージョンが古いことが原因ではないかと考えられる。
参考サイトはどれも、Processing3についての話であったが、自分が使用しているのは、Processing2である。

まぁ、何はともあれ、Processing2をVSCodeでいじれるようになったので幸せである。
課題を今から始めるとする。