组建按需加载之babel-plugin-import

笔者最近发现，很多开发的小伙伴引用第三方的库都喜欢全局引入，其实这样是非常不友好的

// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'
// 全局引入
import Vant from 'vant';
import 'vant/lib/index.css';
Vue.use(Vant);
Vue.config.productionTip = false

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  components: { App },
  template: '<App/>'
})

 下面我介绍一下babel-plugin-import，它是一个babel插件，在编译的过程中会自动转换为按需引入的方式。具体使用方法如下：

1.安装babel-plugin-import

npm i babel-plugin-import -D

2.在.babelrc中配置

3.在组建中使用