テストの結果は・・・
リアルタイムで作業します。
2022年4月5日
8時34分
作業開始
8時38分
ひな形プロジェクト作成完了
フォルダを移動して"ionic info"
----------------------------------------
[WARN] Error loading @capacitor/ios package.json: Error: Cannot find module
'@capacitor/ios/package'
Require stack:
-
C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli\lib\project\index.js
-
C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli\lib\index.js
- C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli\index.js
- C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli\bin\ionic
[WARN] Error loading @capacitor/android package.json: Error: Cannot find module
'@capacitor/android/package'
Require stack:
-
C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli\lib\project\index.js
-
C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli\lib\index.js
- C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli\index.js
- C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli\bin\ionic
Ionic:
Ionic CLI : 6.19.0 (C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli)
Ionic Framework : @ionic/angular 6.0.14
@angular-devkit/build-angular : 13.2.6
@angular-devkit/schematics : 13.2.6
@angular/cli : 13.2.6
@ionic/angular-toolkit : 6.1.0
Capacitor:
Capacitor CLI : 3.4.3
@capacitor/android : not installed
@capacitor/core : 3.4.3
@capacitor/ios : not installed
Utility:
cordova-res : 0.15.4
native-run : 1.5.0
System:
NodeJS : v16.14.0 (C:\Program Files\nodejs\node.exe)
npm : 8.3.1
OS : Windows 10
----------------------------------------
コピー完了
8時41分
続けて、ビルド
ビルド完了
8時43分
npm install @capacitor/android@latest
8時44分
ionic info
----------------------------------------
[WARN] Error loading @capacitor/ios package.json: Error: Cannot find module
'@capacitor/ios/package'
Require stack:
-
C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli\lib\project\index.js
-
C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli\lib\index.js
- C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli\index.js
- C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli\bin\ionic
Ionic:
Ionic CLI : 6.19.0 (C:\Users\ユーザー名\AppData\Roaming\npm\node_modules\@ionic\cli)
Ionic Framework : @ionic/angular 6.0.14
@angular-devkit/build-angular : 13.2.6
@angular-devkit/schematics : 13.2.6
@angular/cli : 13.2.6
@ionic/angular-toolkit : 6.1.0
Capacitor:
Capacitor CLI : 3.4.3
@capacitor/android : 3.4.3
@capacitor/core : 3.4.3
@capacitor/ios : not installed
Utility:
cordova-res : 0.15.4
native-run : 1.5.0
System:
NodeJS : v16.14.0 (C:\Program Files\nodejs\node.exe)
npm : 8.3.1
OS : Windows 10
----------------------------------------
8時44分
ionic cap add android
8時45分
npx cap sync android
8時46分
ionic cap open android
AndroidStudioオープン完了
8時49分
実機をつないでエミュレート
8時51分
ダークモード!
だがサイコロ画像をコピーするのを忘れた事に気づく。
さらによく見ると実機にエミュレートしたアプリが残っている(湖畔の城)
誤解していたのですが、AndroidStudioの実機エミュレートは(方法は違っても)普通にインストールするのだと理解しました。(一時的インストールを想像していました)
アンイストール後のテストは、やはりダークモード
次にAndroidStudioを終了して、実機アンインストール、サイコロをコピーして、"ionic build --prod"と"npx cap sync android"の後、再度の実機テスト。
結果:ダークモード
これは、強制的に背景色とテキスト色を設定する方法を検討した方が良さそうですね。
(それはそれでページによって、配色を変える実装につながるメリットにもなります)




