1.先创建vue项目，我准备把项目放在e盘下：E:\VueElement-ui
命令行进入这个目录：cd E:\VueElement-ui
创建一个基于 webpack 模板的新项目
（1）vue init webpack register(项目名)
（2）需要yes按Enter健就可以了，不需要输入n,然后按Enter健。
（3）创建完成：在目录中可看到
（4）运行：命令行进入到刚创建好的目录：cd register
（5）运行：npm run dev
（6）成功：在浏览器输入：http://localhost:8080/
出现这个界面说明vue项目创建成功：
现在vue引入Vant
1.打开cmd，进入到当前刚创建的vue项目目录
2.在当前目录中运行：
npm i vant -S：这是简写形式。
npm install vant --save:这是完整写法。
3.接下来我们还需要安装一个插件，方便我们之后优雅的使用vant,在控制台输入npm i babel-plugin-import -D 或者npm install babel-plugin-import --save-dev
4.接下来我们去.babelrc中配置一下
.babelrc代码：
{
"presets": [
["env", {
"modules": false,
"targets": {
"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
}
}],
"stage-2"
],
"plugins": ["transform-vue-jsx", "transform-runtime", ["import",{"libraryName":"vant","style":true}]],
"env": {
"test": {
"presets": ["env", "stage-2"],
"plugins": ["transform-vue-jsx", "transform-es2015-modules-commonjs", "dynamic-import-node"]
}
}
}
引入组件
在main.js里导入所有组件：
importVantfrom'vant'
import'vant/lib/vant-css/index.css'
Vue.use(Vant);
接下来我们就可以在我们的页里面大摇大摆地使用Vant了。我们可以做个测试，比如我们在HelloWorld.vue里添加一下button
<van-button type="default">默认按钮</van-button>
<van-button type="primary">主要按钮</van-button>
<van-button type="danger">危险按钮</van-button>
