html页面如何按需导入vant,vant在页面内实现按需引入

https://xim6.cn/archives/63.html  参考

https://blog.csdn.net/weixin_45416117/article/details/100036688 参考

首先安装了vant

npm i vant -S

按需引入

babel-plugin-import 是一款 babel 插件，它会在编译过程中将 import 的写法自动转换为按需引入的方式

# 安装插件

npm i babel-plugin-import -D

在.babelrc中配置plugins(插件)

"plugins": [

"transform-vue-jsx",

"transform-runtime",

["import",{"libraryName":"vant","style":true}]

]

在main.js中添加你要引入的(不推荐)

import { Area,Popup } from 'vant';

Vue.use(Area);

Vue.use(Popup);

推荐下面第二种页面内引入组件:

1.引入几个组件，就在{}里面写入几个组件

import { Area, Popup } from "vant";

2.有几个组件，就在component里面按照样子写几个

components: {

[Area.name]: Area,

[Popup.name]: Popup

},

参考代码:

选择地址