这里记录一下  使用wepy框架和  vant-weapp库开发小程序
废话 不多说

wepy文档: https://tencent.github.io/wepy/document.html#/

vant-weapp 文档 https://youzan.github.io/vant-weapp/#/quickstart
1 安装环境
全局安装或更新WePY命令行工具
 wepy init standard myproject   (1.7版本以后)

切换至项目目录

cd myproject

安装依赖

npm  install

开启实时编译

wepy build --watch

然后运行会报错

因为wepy自带编译和压缩,所以取消

正常了

然后  引入 vant-weapp
# npm npm i vant-weapp -S --production

此时node-modules 下面有个 vant-weapp的文件,

将其中的lib拷贝出来,放在components下面
  
在template 下面使用  

在config中声名

然后用开发者工具运行

bingo!!

如何使用wepy和 vant-weapp开发小程序的更多相关文章

  1. wepy开发小程序eslint报错error 'getApp' is not defined no-undef

    wepy开发小程序使用getApp().globalData保存全局数据很方便,但是会在控制台看到很多报错:“error 'getApp' is not defined no-undef”,这是esl ...

  2. 用RegularJS开发小程序 — mpregular解析

    本文来自网易云社区. Mpregular 是基于 RegularJS(简称 Regular) 的小程序开发框架.开发者可以将直接用 RegularJS 开发小程序,或者将现有的 RegularJS 应 ...

  3. 使用mpvue开发小程序教程(一)

    前段时间,美团开源了mpvue这个项目,使得我们又多了一种用来开发小程序的框架选项.由于mpvue框架是完全基于Vue框架的(重写了其runtime和compiler),因此在用法上面是高度和Vue一 ...

  4. 使用mpvue开发小程序教程(二)

    在上篇文章中,我们介绍了使用mpvue开发小程序所需要的一些开发环境的搭建,并创建了第一个mpvue小程序代码骨架并将其运行起来.在本文中,我们来研究熟悉一下mpvue项目的主要目录和文件结构. 在V ...

  5. 使用mpvue开发小程序教程(三)

    在上一篇文章中,我们熟悉了一下通过vue-cli生成的mpvue工程代码骨架的基本结构,大致了解了每一个部分的代码到底要放到何处.从本文起我们就开始涉及真正的编码部分,学习使用Vue的语法去编写小程序 ...

  6. 使用mpvue开发小程序教程(四)

    在上一章节中,我们将vue-cli命令行工具生成的代码骨架中的src目录清理了一遍,然后从头开始配置和编写了一个可以运行的小程序页面,算是正真走上了使用mpvue开发小程序的第一步.今天我们将进一步来 ...

  7. 使用mpvue开发小程序教程(五)

    在上一章节中,我们了解了组件的三个基本特性以及组件的基本使用方法.在实际的小程序开发中,我们应该以组件的思维去设计每个小程序的功能页面,对其进行合理的组件拆分,让每个部分都保持功能简洁.条理清楚.各司 ...

  8. 使用mpvue开发小程序

    前言: 最近接到小程序的开发需求,由于之前也没开发过小程序,心情还是有点激动.先花15分钟看一遍小程序官方文档,再花10分钟看一遍mpvue官方文档,然后拿着原型图和UI图就开干.踩了不少坑,写篇博客 ...

  9. 如何用Baas快速在腾讯云上开发小程序-系列4:实现客户侧商品列表、商品详情页程序

    版权声明:本文由贺嘉 原创文章,转载请注明出处: 文章原文链接:https://www.qcloud.com/community/article/431172001487671163 来源:腾云阁 h ...

随机推荐

  1. JS语法基础

    js声明 <!--在head标签中使用script标签进行js代码域声明--> <script type="text/javascript" language=& ...

  2. Ubuntu 16.04 安装 Python3.6

    直接在官网下载 Python3.6.3 的源代码,解压缩,按照 README.rst 内说明步骤编译安装即可,这样 pip3.6 也会自动安装. 注意第一步配置时最好指定安装目录, $ ./confi ...

  3. 忘记秘密利用python模拟登录暴力破解秘密

    忘记秘密利用python模拟登录暴力破解秘密: #encoding=utf-8 import itertools import string import requests def gen_pwd_f ...

  4. thinkphp url build 生成localhost.localhost的解决方案

    找到框架核心Url.php的下面一段代码 // 原代码// URL组装$url = $domain . rtrim($this->root ?: $this->app['request'] ...

  5. Django字符串翻译

    文章出处:https://www.jb51.net/article/70077.htm Django模板使用两种模板标签,且语法格式与Python代码有些许不同. 为了使得模板访问到标签,需要将 {% ...

  6. 排错技能:任务管理器中追踪某w3wp.exe是哪个IIS站点的application pool

    如果Windows的任务管理器中发现某个w3wp.exe占用了100%CPU,那我们就要揪出这是那个网站的application pool在作怪, 首先,每个站点一定要单独使用各自的applicati ...

  7. docker(ce) on Ubuntu

    Note: # - requires given linux commands to be executed with root privileges either directly as a roo ...

  8. 最简单打开三星s8+usb调试模式的步骤

    就在我们使用安卓手机通过数据线链接到PC的时候,如果手机没有开启usb开发者调试模式,PC则没能够成功读到我们的手机,部分app也没能够正常使用,遇到这个情况我们需要找解决方法将手机的usb开发者调试 ...

  9. (简单)华为M3青春 CPN-AL10的Usb调试模式在哪里打开的步骤

    每次我们使用PC通过数据线连接到安卓手机的时候,如果手机没有开启usb开发者调试模式,PC则没能成功检测到我们的手机,有时候我们使用的一些功能比较强的的应用软件比如以前我们使用的一个应用软件引号精灵, ...

  10. es6 实现数组的操作

    1.实现数组的去重: 1.1.方法一: let arr = [{id: 1, name: 'aa'}, {id: 2, name: 'bb'}, {id: 3, name: 'cc'}, {id: 4 ...