element-ui vant 安装引入应用

1、element-ui安装

使用npm安装:npm i element-ui -S

查看配置文件package.json文件是否有element-ui的版本信息
element-ui vant 安装引入应用
在main.js中引入:
element-ui vant 安装引入应用
当然也可以按需引入Element UI组件
安装babel-plugin-component:
element-ui vant 安装引入应用
然后,将.babelrc修改为:
element-ui vant 安装引入应用
接下来,如果您只希望保留部分组件,例如Button和Select,那么需要在main.js中写入以下内容:
element-ui vant 安装引入应用
详细使用请参考官方文档

注意!!!!
我的项目里怎么也找不到.babelrc文件!!!我又去百度才找到原因。。
.babelrc文件找不到的原因是因为我在创建项目时用的命令是vue create project-name,所以找不到.babelrc文件。。。创建项目的命令必须是vue init webpack project-name才能有.babelrc文件,解决找不到.babelrc文件

2、vant安装

在现有项目中使用 Vant 时,可以通过npm或yarn安装

通过 npm 安装:npm i vant -S
通过yarn安装:yarn add vant

查看配置文件package.json文件是否有vant的版本信息
element-ui vant 安装引入应用
引入插件

方式一. 自动按需引入组件 (推荐)
安装插件:npm i babel-plugin-import -D
element-ui vant 安装引入应用
方式二. 手动按需引入组件
element-ui vant 安装引入应用
方式三. 导入所有组件
element-ui vant 安装引入应用
注:配置按需引入后,将不允许直接导入所有组件!!
详细使用请参考官方文档