vue + ionic 搭建移动端项目

vue创建项目：

• 找一个空文件夹，使用如下命令构建vue 项目：
   

  vue create app-web
  
  备注：app-web为项目的名字

   

• 构建成功后，运行：npm run serve ，在浏览器中输入：locahost:8080 即可看到效果
• 使用如下命令，安装ionic:
   

  npm install @ionic/vue @ionic/core --save
  
  备注： --save 保存在package.json中的dependencies中
        --save -dev 保存在package.json中的devDependencies中

   

• 安装成功后，在package.json中就可以看到刚刚安装好的ionic及其版本号
• 在【app-web】【src】【main.ts】中使用如下方式引入ionic：
   

  // main.ts
  
  import Ionic from '@ionic/vue';
  import '@ionic/core/css/ionic.bundle.css';
  
  Vue.use(Ionic);

   

• 页面中直接使用即可：
   

  <ion-button color="primary">Primary</ion-button>
  <ion-button color="secondary">Secondary</ion-button>
  <ion-button color="tertiary">Tertiary</ion-button>

   

•  

• ---

  ---

  ---

   

•