vant-創建項目

1、在新項目中使用 Vant 時，推薦使用 Vue 官方提供的腳手架 Vue Cli 創建項目

# 安裝 Vue Cli npm install -g @vue/cli # 創建一個項目 vue create hello-world # 創建完成后，可以通過命令打開圖形化界面，如下圖所示 vue ui 

2、在圖形化界面中，點擊依賴 -> 安裝依賴，然后將 vant 添加到依賴中，同時添加其它需要的依賴，如路由，axios等

 3、安裝相關的插件

 4、引用babel 插件

babel-plugin-import 是一款 babel 插件，它會在編譯過程中將 import 的寫法自動轉換為按需引入的方式

（1）# 安裝插件 npm i babel-plugin-import -D

（2）在 babel.config.js 中配置

       module.exports = { plugins: [ ['import', { libraryName: 'vant', libraryDirectory: 'es', style: true }, 'vant'] ] };

（3） 接着你可以在代碼中直接引入 Vant 組件，插件會自動將代碼轉化為按需引入形式

        import { Button } from 'vant';

5、安裝好的項目截圖如下：

 

 

6、如果要切換項目，如圖