📌

Ionic CLIでAngular Standaloneをサポートする方法

2023/05/29に公開

備忘録的に。

1. CLIのバージョンを最新にする

どこまでグローバルにいれてるかはありますが、フルでこんな感じ。

% npm install @ionic/cli@latest @angular/cli@latest -g
% npm install @ionic/angular-toolkit@latest -d

2. プロジェクトのangular.jsonを書き換え

json
  {
    "sourceRoot": "src",
    "projectType": "application",
    "prefix": "app",
-   "schematics": {},
+   "schematics": {
+     "@ionic/angular-toolkit:page": {
+       "styleext": "scss",
+       "standalone": true
+     },
+     "@schematics/angular:component": {
+       "standalone": true
+     }
+   }
+ }

まとめ

簡単ですね。ただ一点注意点があって、RoutingModuleから、provideRouterに移行してる場合、routesのファイル名の命名規則が以下のように決まっています。

**.routes.ts 

私はひとつだけファイルを **.routing.ts にしてたため、CLIが認識してくれませんでした。**.routes.ts にリネームしたら、ちゃんと認識してくれました。スターターテンプレートやCLIで新規作成した場合、ルーター名はきまっていますが、自分で作る場合は注意が必要です。

それではまた。

Discussion