1. プロジェクト作成
cordova createコマンドでプロジェクトを作成します。$ cordova create firstsample com.example.firstsample FirstSample -d Using detached cordova-create Creating a new cordova project. Copying assets." |
firstsample … ディレクトリ
com.example.firstsample … 逆引きドメインスタイル識別子
FirstSample … タイトル
現バージョン(8.1.2)では以下のようなフォルダ構成ができます。
$ ls -og --group-directories-first total 5 drwxr-xr-x 1 0 Feb 2 20:18 hooks drwxr-xr-x 1 0 Feb 2 20:18 platforms drwxr-xr-x 1 0 Feb 2 20:18 plugins drwxr-xr-x 1 0 Feb 2 20:18 res drwxr-xr-x 1 0 Feb 2 20:18 www -rw-r--r-- 1 991 Feb 2 20:18 config.xml -rw-r--r-- 1 373 Feb 2 20:18 package.json |
次にプラットフォームを追加します。私はAndroidしか使わないのでとりあえずそれだけ。
$ cordova platform add android $ cordova platform ls Installed platforms: android 7.1.4 Available platforms: browser ~5.0.1 ios ~4.5.4 osx ~4.0.1 windows ~6.0.0 |
ここまでで最低限の準備はOKですかね。
2. Visual Studio Codeで使う
先ほど作ったプロジェクトフォルダをVSCodeで開きます。
左端のアクティビティバーのデバッグボタンをクリックします。
左上で「デバッグ」の構成が選択できますので、ここで歯車アイコンをクリックして「Cordova」を選択します。
当面はブラウザで作業を行いますので「Simulate Android in browser」を選択します。
デバッグ開始を行うと以下のようにブラウザが起動し初期画面が表示されました。
これであとはコードを加えて作っていく感じですね。