vue 설치

npm install @vue/cli

 

vue create ionic-vue

 

cd ionic-vue

 

npm run serve

 

npm install @ionic/core @ionic/vue vue-router

 

main.js

import Vue from 'vue';
import App from './App.vue';

import IonicVue from '@ionic/vue';
import '@ionic/core/css/core.css';
import '@ionic/core/css/ionic.bundle.css';


Vue.config.productionTip = false;

Vue.use(IonicVue);

new Vue({
  render: h => h(App)
}).$mount('#app');

 

 

App.vue

<template>
  <ion-app>
    <ion-header>
      <ion-toolbar color="primary">
        <ion-title>Hello, Ionic!</ion-title>
      </ion-toolbar>
    </ion-header>
    <ion-content>
      <ion-card>
        <img src="https://images.unsplash.com/photo-1552394459-917cbbffbc84?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=80"/>
        <ion-card-header>
          <ion-card-subtitle>Isn't it great?</ion-card-subtitle>
          <ion-card-title>Look at this view!</ion-card-title>
        </ion-card-header>
        <ion-card-content>
          Although, it does look fairly cold.
        </ion-card-content>
      </ion-card>
    </ion-content>
  </ion-app>
</template>

<script>


export default {
  name: 'app',
}
</script>

<style>
</style>