feat(ionic-react): generate applications with ionic v6

packages/ionic-react/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+# 13.1.0
+
+## Features
+
+- generate applications with Ionic v6
+
 # 13.0.0
 
 ## Features

packages/ionic-react/src/generators/application/files/blank/src/app/App.tsx.template

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Redirect, Route } from 'react-router-dom';
-import { IonApp, IonRouterOutlet } from '@ionic/react';
+import { IonApp, IonRouterOutlet, setupIonicReact } from '@ionic/react';
 import { IonReactRouter } from '@ionic/react-router';
 import Home from './pages/Home';
 
@@ -23,6 +23,8 @@ import '@ionic/react/css/display.css';
 /* Theme variables */
 import './theme/variables.css';
 
+setupIonicReact();
+
 const App: React.FC = () => (
   <IonApp>
     <IonReactRouter>

packages/ionic-react/src/generators/application/files/list/src/app/App.tsx.template

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Redirect, Route } from 'react-router-dom';
-import { IonApp, IonRouterOutlet } from '@ionic/react';
+import { IonApp, IonRouterOutlet, setupIonicReact } from '@ionic/react';
 import { IonReactRouter } from '@ionic/react-router';
 import Home from './pages/Home';
 import ViewMessage from './pages/ViewMessage';
@@ -24,6 +24,8 @@ import '@ionic/react/css/display.css';
 /* Theme variables */
 import './theme/variables.css';
 
+setupIonicReact();
+
 const App: React.FC = () => (
   <IonApp>
     <IonReactRouter>

packages/ionic-react/src/generators/application/files/sidemenu/src/app/App.tsx.template

@@ -1,7 +1,7 @@
 import Menu from './components/Menu';
 import Page from './pages/Page';
 import React from 'react';
-import { IonApp, IonRouterOutlet, IonSplitPane } from '@ionic/react';
+import { IonApp, IonRouterOutlet, IonSplitPane, setupIonicReact } from '@ionic/react';
 import { IonReactRouter } from '@ionic/react-router';
 import { Redirect, Route } from 'react-router-dom';
 
@@ -24,6 +24,8 @@ import '@ionic/react/css/display.css';
 /* Theme variables */
 import './theme/variables.css';
 
+setupIonicReact();
+
 const App: React.FC = () => {
 
   return (

packages/ionic-react/src/generators/application/files/tabs/src/app/App.tsx.template

@@ -7,7 +7,8 @@ import {
   IonRouterOutlet,
   IonTabBar,
   IonTabButton,
-  IonTabs
+  IonTabs,
+  setupIonicReact
 } from '@ionic/react';
 import { IonReactRouter } from '@ionic/react-router';
 import { ellipse, square, triangle } from 'ionicons/icons';
@@ -34,6 +35,8 @@ import '@ionic/react/css/display.css';
 /* Theme variables */
 import './theme/variables.css';
 
+setupIonicReact();
+
 const App: React.FC = () => (
   <IonApp>
     <IonReactRouter>

packages/ionic-react/src/generators/application/generator.spec.ts

@@ -55,7 +55,6 @@ describe('application', () => {
     const packageJson = readJson(appTree, 'package.json');
     expect(packageJson.dependencies['@ionic/react']).toBeDefined();
     expect(packageJson.dependencies['@ionic/react-router']).toBeDefined();
-    expect(packageJson.dependencies['ionicons']).toBeDefined();
     expect(packageJson.devDependencies['@nrwl/react']).toBeDefined();
     expect(packageJson.devDependencies['@nxtend/capacitor']).toBeDefined();
   });

packages/ionic-react/src/generators/application/lib/add-dependencies.ts

@@ -13,7 +13,6 @@ export function addDependencies(host: Tree) {
     {
       '@ionic/react': ionicReactVersion,
       '@ionic/react-router': ionicReactRouterVersion,
-      ionicons: ioniconsVersion,
     },
     { '@nrwl/react': nxVersion, '@nxtend/capacitor': nxtendCapacitorVersion }
   );

packages/ionic-react/src/migrations/update-13-1-0/ionic-6-migration-13-1-0.ts

@@ -0,0 +1,9 @@
+import { logger, stripIndents } from '@nrwl/devkit';
+
+export default async function update() {
+  logger.info(stripIndents`
+    Ionic 6 has been released and it is recommended that you upgrade your application if you have not already.
+
+    https://ionicframework.com/docs/intro/upgrading-to-ionic-6#react
+    `);
+}

packages/ionic-react/src/utils/versions.ts

@@ -1,5 +1,5 @@
 export const nxVersion = '^13.0.0';
 export const nxtendCapacitorVersion = '^13.0.0';
-export const ionicReactVersion = '^5.8.3';
-export const ionicReactRouterVersion = '^5.8.3';
-export const ioniconsVersion = '^5.5.3';
+export const ionicReactVersion = '^6.0.0';
+export const ionicReactRouterVersion = '^6.0.0';
+export const ioniconsVersion = '^6.0.0';