chore(): add page component

vue/package.json

@@ -53,17 +53,15 @@
     "tslint": "5.11.0",
     "tslint-ionic-rules": "0.0.19",
     "typescript": "3.1.1",
-    "vue-class-component": "^6.2.0",
-    "vue-property-decorator": "^7.2.0",
     "vue": "^2.5.17",
     "vue-template-compiler": "^2.5.17",
-    "vue-router": "^3.0.1",
-    "ionicons": "^4.6.0"
+    "vue-router": "^3.0.1"
   },
   "dependencies": {
     "@ionic/core": "^4.6.0"
   },
   "peerDependencies": {
-    "ionicons": "^4.5.10-2"
+    "vue": "^2.5.17",
+    "vue-router": "^3.0.1"
   }
 }

vue/rollup.config.js

@@ -24,9 +24,7 @@ function baseConfig() {
     output: [
       outputConfig('', 'umd', {
         globals: {
-          vue: 'Vue',
-          'vue-class-component': 'VueClassComponent',
-          'vue-property-decorator': 'vue-property-decorator',
+          vue: 'Vue'
         },
       }),
       outputConfig('.esm', 'esm'),
@@ -35,8 +33,6 @@ function baseConfig() {
     external: [
       'vue',
       'vue-router',
-      'vue-class-component',
-      'vue-property-decorator',
       '@ionic/core',
       '@ionic/core/loader',
       'ionicons',

vue/src/components/navigation/ion-page.ts

@@ -4,6 +4,6 @@ export default {
   name: 'IonPage',
   functional: true,
   render(h: CreateElement, { children }: RenderContext) {
-    return h('div', { class: { 'ion-page':true } }, children);
+    return h('div', { class: { 'ion-page': true } }, children);
   }
 };

vue/src/ionic.ts

@@ -12,6 +12,7 @@ import { IonicConfig } from '@ionic/core';
 import { appInitialize } from './app-initialize';
 import { VueDelegate } from './controllers/vue-delegate';
 import IonTabs from './components/navigation/ion-tabs';
+import IonPage from './components/navigation/ion-page';
 import { createInputComponent } from './components/inputs';
 
 export interface Controllers {
@@ -31,9 +32,9 @@ declare module 'vue/types/vue' {
 }
 
 
-function createApi(Vue: VueConstructor) {
+function createApi(vueInstance: VueConstructor) {
   const cache: Partial<Controllers> = {};
-  const vueDelegate = new VueDelegate(Vue);
+  const vueDelegate = new VueDelegate(vueInstance);
 
   return {
     get actionSheetController() {
@@ -95,6 +96,7 @@ export const install: PluginFunction<IonicConfig> = (_Vue, config) => {
   Vue = _Vue;
   Vue.config.ignoredElements.push(/^ion-/);
   Vue.component('IonTabs', IonTabs);
+  Vue.component('IonPage', IonPage);
 
   createInputComponent('IonCheckboxVue', 'ion-checkbox', 'ionChange', 'checked');
   createInputComponent('IonDatetimeVue', 'ion-datetime');

vue/src/router.ts

@@ -1,7 +1,7 @@
 import VueRouter, { Route } from 'vue-router';
 import { PluginFunction } from 'vue';
 import { RouterArgs } from './interfaces';
-import IonVueRouter from './components/ion-vue-router';
+import IonVueRouter from './components/navigation/ion-vue-router';
 import { BackButtonEvent, RouterDirection } from '@ionic/core';
 
 // Extend the official VueRouter