技術標籤：Vuevantvue

Vant-ui 按需引入

前言： babel-plugin-import 是一款 babel 外掛，它會在編譯過程中將 import 的寫法自動轉換為按需引入的方式。

第一步 安裝外掛

  npm i babel-plugin-import -D

第二步 建立.babel.config.js檔案*

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

第三步 所需元件中引入

<van-nav-bar
  title="標題"
  left-text="返回"
  right-text="按鈕"
  left-arrow
  @click-left="onClickLeft"
  @click-right="onClickRight"
/>
--------------------------------------------------------------------
 
-----------
  import { NavBar } from 'vant'   //按需引入(導航欄NavBar)
   components: {
        [NavBar.name]: NavBar     //註冊單個的元件
  }