👋 Thanks for using the Ionic VS Code extension to build apps faster. Please consider leaving an honest rating and review, as it helps us reach more Ionic developers like you.
Ionic Visual Studio Code Extension v1.68 is out now! Here are some of the major features added in the past few months.
Migrate to Ionic Standalone Components
Developers can now import only the Ionic components used in an app. This standalone component approach allows you to use tree shaking to reduce overall build size and newer Angular features like ESBuild. The VS Code extension can migrate for you by clicking Project > … then choosing "Migrate to Ionic standalone components."
Automatic Import of Ionic Standalone Components
The drawback to standalone components is that each component has to be manually imported and registered. Enter automatic import! Add an Ionic component into an HTML file, like in home.page.html:
<ion-button><ion-button>
Over in home.page.ts, the Extension automatically imports the IonButton component and adds it to the list of imports (see bolded lines):
import { IonButton } from '@ionic/angular/standalone';
@Component({
standalone: true,
imports: [IonButton]
})
export class HomePage { }
This saves a bunch of time and switching between files.
Capacitor 5 Migration
While upgrading to newer Capacitor versions manually is quite painless, why not have the Extension do it for you? Changes to plugins, as well as the iOS and Android projects, are made during the migration. Look for this option under the Recommendations section.
Capacitor and Cordova Plugin Search
Search for native functionality, then easily install, uninstall, or update a Capacitor or Cordova plugin. Filter by platform, officially supported, or Capacitor-only plugins. To open the search window, click the three dots next to the "Plugins" menu item.
Angular 17 Enhancements
The Angular 17 release brings a lot of developer experience improvements that the Ionic VS Code Extension helps you leverage easily. This includes control flow migration and recommendations to switch to ESBuild and migrate between major Angular versions.
👋 👋 This is just a look into some recently added features. For a complete list, check out the changelog.