feat: migrate ionic start to Standalone

ionic-start/src/app/app.component.ts

@@ -1,20 +1,10 @@
-import { Component, OnInit } from '@angular/core';
-import {
-  provideVSCodeDesignSystem,
-  vsCodeButton,
-  vsCodeCheckbox,
-  vsCodeLink,
-  vsCodePanelView,
-  vsCodeProgressRing,
-  vsCodeTag,
-  vsCodeRadio,
-  vsCodeRadioGroup,
-  vsCodeTextField,
-  vsCodeDivider,
-} from '@vscode/webview-ui-toolkit';
+import { Component, CUSTOM_ELEMENTS_SCHEMA, OnInit } from '@angular/core';
+
 import { MessageType, sendMessage } from './utilities/messages';
 import { Template } from './utilities/template';
 import { getValue } from './utilities/dom';
+import { FormsModule } from '@angular/forms';
+import { BrowserModule } from '@angular/platform-browser';
 
 interface Framework {
   name: string;
@@ -29,26 +19,13 @@ interface Target {
   appearance: string;
 }
 
-// In order to use the Webview UI Toolkit web components they
-// must be registered with the browser (i.e. webview) using the
-// syntax below.
-provideVSCodeDesignSystem().register(
-  vsCodeButton(),
-  vsCodeTextField(),
-  vsCodePanelView(),
-  vsCodeLink(),
-  vsCodeTag(),
-  vsCodeCheckbox(),
-  vsCodeDivider(),
-  vsCodeRadio(),
-  vsCodeRadioGroup(),
-  vsCodeProgressRing(),
-);
-
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css'],
+  standalone: true,
+  imports: [BrowserModule, FormsModule],
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
 })
 export class AppComponent implements OnInit {
   private templates: Template[] = [];

ionic-start/src/main.ts

@@ -1,13 +1,39 @@
 import { enableProdMode } from '@angular/core';
-import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-
-import { AppModule } from './app/app.module';
 import { environment } from './environments/environment';
+import { bootstrapApplication } from '@angular/platform-browser';
+import { AppComponent } from './app/app.component';
+import {
+  provideVSCodeDesignSystem,
+  vsCodeButton,
+  vsCodeCheckbox,
+  vsCodeDivider,
+  vsCodeLink,
+  vsCodePanelView,
+  vsCodeProgressRing,
+  vsCodeRadio,
+  vsCodeRadioGroup,
+  vsCodeTag,
+  vsCodeTextField,
+} from '@vscode/webview-ui-toolkit';
 
 if (environment.production) {
   enableProdMode();
 }
 
-platformBrowserDynamic()
-  .bootstrapModule(AppModule)
-  .catch((err) => console.error(err));
+// In order to use the Webview UI Toolkit web components they
+// must be registered with the browser (i.e. webview) using the
+// syntax below.
+provideVSCodeDesignSystem().register(
+  vsCodeButton(),
+  vsCodeTextField(),
+  vsCodePanelView(),
+  vsCodeLink(),
+  vsCodeTag(),
+  vsCodeCheckbox(),
+  vsCodeDivider(),
+  vsCodeRadio(),
+  vsCodeRadioGroup(),
+  vsCodeProgressRing(),
+);
+
+bootstrapApplication(AppComponent).catch((err) => console.error(err));

package.json

@@ -2,7 +2,7 @@
   "name": "ionic",
   "displayName": "Ionic",
   "description": "Official extension for Ionic and Capacitor development",
-  "version": "1.98.0",
+  "version": "1.99.0",
   "icon": "media/ionic.png",
   "publisher": "Ionic",
   "keywords": [