1.搭建vue脚手架
1.通过vscode的终端输入命令:vue init mpvue/mpvue-quickstart project,进行小程序的创建,
通过vscode打开新创建的文件目录。
2.使用命令npm install,下载所需要的npm的依赖。
3.通过npm下载需要的组件库UI(以VantUI为例)
VantUI官网:Vant Weapp - 轻量、可靠的小程序 UI 组件库
在app.json文件中添加以下代码
注意引入的是miniprogram_npm下的文件,而不是node_package
最后应用在代码当中
2.问题与解决
因为基于vue/cli生成的项目的“miniprogramRoot”是“dist/wx/”而不是"miniprogram",而且npm构建的项目miniprogram_npm默认路径与dist/wx/同级,导致app.json找不到文件路径,可能就会报错。
解决方法:将miniprogram_npm文件移至dist/wx/目录下,就可以访问。