uniapp使用vant

uniapp使用vant

0.效果

1. 打开HBuilder X，点击左上角 新建项目，选择uni-app,然后起个项目名字，已经存放文件的目录
   

2. 打开文件所在目录，输入cmd

3. 

4. 在窗口输入初始化package.json 里面的内容自己填，也可以回车按到底。npm init
   

5. 然后下载vant的依赖使用 npm i vant -S
   

6. 在main.js中引入

	import vant from 'vant'
	import 'vant/lib/index.css'
	Vue.use(vant)

最后在page.json中加入这两端代码

{
    
    
	"pages": [ 
		{
    
    
			"path": "pages/index/index",
			"style": {
    
    
				"navigationBarTitleText": "uni-app"
			},
			"usingComponents":{
    
    
				"van-button":"/wxcomponents/vant/button/index"
			}
		}
	],
	"globalStyle": {
    
    
		"navigationBarTextStyle": "black",
		"navigationBarTitleText": "uni-app",
		"navigationBarBackgroundColor": "#F8F8F8",
		"backgroundColor": "#F8F8F8"
	},
	"easycom": {
    
    
		"autoscan": true,
		"constom": {
    
    
			"van-(.*)": "@wxcomponents/van/$1/index.vue"
		}
	}
}

页面中使用