精华内容
下载资源
问答
  • WePY的安装或更新都通过npm进行,全局安装或更新WePY命令行工具,使用以下命令: npm install wepy-cli -g 稍等片刻,成功安装后,即可创建WePY项目。 注意:如果npm安装时间过长或者是连接超时而导致的失败,则...

    WePY的安装或更新都通过npm进行,全局安装或更新WePY命令行工具,使用以下命令:

    npm install wepy-cli -g

    稍等片刻,成功安装后,即可创建WePY项目。

    注意:如果npm安装时间过长或者是连接超时而导致的失败,则可以使用国内的镜像源,这里推荐一个稳定的源,来自淘宝。网站地址为http://npm.taobao.org/,可以使用淘宝定制的cnpm(gzip压缩支持)命令行工具代替默认的npm:

    $ npm install -g cnpm --registry=https://registry.npm.taobao.org

    安装好环境后,再找一个良好的编写代码的IDE环境。这里强烈推荐来自JetBrains系列的WebStorm最新版本,它已经完美支持了Vue.js的开发以及ESLint的语法形式,所以编写代码非常顺畅和方便,其编写代码的页面如图1-26所示。

    图1-26 编辑器界面

    同样,在WebStorm中使用Alt+F12键可以唤起内置的命令行,这对于需要编译的WePY而言,也无需每次使用cd命令进入项目文件这样方便得多。

    微信小程序的结构化开发方法,少走弯路,高效开发,一起来学习《微信小程序项目开发实战:用WePY、mpvue、Taro打造高效的小程序》吧。

    展开全文
  • WePY的安装或更新都通过npm进行,全局安装或更新WePY命令行工具,使用以下命令: npm install wepy-cli -g 稍等片刻,成功安装后,即可创建WePY项目。 注意:如果npm安装时间过长或者是连接超时而导致的失败,则...

    WePY的安装或更新都通过npm进行,全局安装或更新WePY命令行工具,使用以下命令:

    npm install wepy-cli -g

    稍等片刻,成功安装后,即可创建WePY项目。

    注意:如果npm安装时间过长或者是连接超时而导致的失败,则可以使用国内的镜像源,这里推荐一个稳定的源,来自淘宝。网站地址为http://npm.taobao.org/,可以使用淘宝定制的cnpm(gzip压缩支持)命令行工具代替默认的npm:

    $ npm install -g cnpm --registry=https://registry.npm.taobao.org

    安装好环境后,再找一个良好的编写代码的IDE环境。这里强烈推荐来自JetBrains系列的WebStorm最新版本,它已经完美支持了Vue.js的开发以及ESLint的语法形式,所以编写代码非常顺畅和方便,其编写代码的页面如图1-26所示。

    图1-26 编辑器界面

    同样,在WebStorm中使用Alt+F12键可以唤起内置的命令行,这对于需要编译的WePY而言,也无需每次使用cd命令进入项目文件这样方便得多。

    微信小程序的结构化开发方法,少走弯路,高效开发,一起来学习《微信小程序项目开发实战:用WePY、mpvue、Taro打造高效的小程序》吧。

    转载于:https://my.oschina.net/tushuchen/blog/3068103

    展开全文
  • 微信小程序框架WePY 使用 从环境搭建 到 入门 实现可运行demo 适用于初学者
  • Wepy开发小程序文档

    2018-12-31 11:57:00
    环境配置 (1)安装nodejs,下载地址:https://nodejs.org/zh-cn/ (2)全局安装或更新WePY命令行工具,在命令行中执行 npm install wepy-cli –g 项目初始化 (1)创建项目:wepy init standard cust (2)...
    1. 环境配置

    (1) 安装nodejs,下载地址:https://nodejs.org/zh-cn/

    (2) 全局安装或更新WePY命令行工具,在命令行中执行

    npm install wepy-cli –g

    1. 项目初始化

    (1) 创建项目:wepy init standard cust

    (2) 切换至项目目录:cd cust

    (3) 安装依赖:npm install

    (4) 开启实时编译: wepy build –watch

    (5) 打开微信开发者工具,创建项目,目录选择dist

    1. 项目目录结构

    ├── dist                   小程序运行代码目录(该目录由WePYbuild指令自动编译生成,请不要直接修改该目录下的文件)

    ├── node_modules           npm

    ├── src                    代码编写的目录(该目录为使用WePY后的开发目录)

    |   ├── components         WePY组件目录(组件不属于完整页面,仅供完整页面或其他组件引用)

    ├── helper                 公用js 

    |   |   ├── ajax.js        ajax负责和后端的交互

    |   |   ├── filter.wxs     过滤器

    |   |   ├── func.js        公用方法

    |   |   ├── host.js        域名配置

    |   |   ├──WxValidate.js   表单验证的方法

     

    |   ├── pages              WePY页面目录(属于完整页面)

    |   |   ├── index.wpy      index页面(经build后,会在dist目录下的pages目录生成index.jsindex.jsonindex.wxmlindex.wxss文件)

    |   └── app.wpy            小程序配置项(全局数据、样式、声明钩子等;经build后,会在dist目录下生成app.jsapp.jsonapp.wxss文件)

    |   ├── mixins             混合代码

    |   |   ├──bindValue.js    绑定数据的混合代码

    |   |   ├──listMixins.js   列表页的混合代码

    └── package.json           项目的package配置

    1. 注意事项

    (1) 关闭ES6ES5选项,关闭。 重要:未关闭会运行报错。

    (2) 关闭上传代码时样式自动补全选项,关闭。 重要:某些情况下漏掉此项也会运行报错。

    (3) 关闭代码压缩上传选项,关闭。重要:开启后,会导致真机computed, props.sync 等等属性失效。

    (4) 开启代码验证后,要注意空格和分号

    (5) 使用button跳转授权页面时没效果

    1. API

    (1)ajax 调用ajax方法时需要传的参数/**ajax

     * @param {Object} before 请求前的询问

     * @param {Object} loading 请求过程中的loading

     * @param {Object} fn 请求完后执行的回调

     * @param {Object} data 请求的参数

     * @param {Object} modal 请求完后的对话框

     * @param {Object} hint 请求完后的提示框

     */

    (2) WxValidate表单验,调用此方法时需要实例化这个对象,初始化这个对象时,将验证规则和

    验证字段传进去

    /**

     * 表单验证

     * @param {Object} rules 验证字段的规则

     * @param {Object} messages 验证字段的提示信息

     *

     */

     

    (3) 在原生代码里wepy.$instance代替getApp()

     

    转载于:https://www.cnblogs.com/liubingboke/p/10201722.html

    展开全文
  • 端开发框架和环境都是需要 Node.js ,先安装node.js开发环境WePY借鉴了Vue.js(后文简称Vue)的语法风格和功能特性,vue的运行是要依赖于node的npm的管理工具来实现,下载https://nodejs.org/en/,安装完成之后,...

    文档


    1:安装node

    端开发框架和环境都是需要 Node.js ,先安装node.js开发环境,WePY借鉴了Vue.js(后文简称Vue)的语法风格和功能特性,vue的运行是要依赖于node的npm的管理工具来实现,下载https://nodejs.org/en/,安装完成之后,打开cmd开始输入命令。(我用的是win10系统,所以需要管理员权限,右键点击以管理员身份运行cmd),不然会出现很多报错。

     

    安装成功之后显示如下,查看版本,安装成功。

    2:安装全局淘宝npm镜像

    进入D盘(当然可以根据你自己的选择来安装路径)全局安装镜像。由于npm是国外的,使用起来比较慢,我们这里使用淘宝的cnpm镜像来安装vue.
    淘宝的cnpm命令管理工具可以代替默认的npm管理工具。

    输入命令:npm install -g cnpm --registry=https://registry.npm.taobao.org
    
    

    安装成功之后显示如下,查看版本,安装成功。

     

    3:全局安装或更新WePY命令行工具

    npm install wepy-cli -g
    

    4:初始化一个项目myproject

    注意版本,因为我的版本是1.7.3的
    1.7.0之后的版本使用 wepy init standard myproject 初始化项目

    wepy init standard myproject
    

    暂时可以一路回车,后续如果遇到要做具体的项目的时候,可以根据项目需要填写。

     

    打开d盘,可以看见初始化的项目

     

    目录结构

    ├── dist                   微信开发者工具指定的目录(该目录由WePY的build指令自动编译生成,请不要直接修改该目录下的文件)
    ├── node_modules           
    ├── src                    代码编写的目录(该目录为使用WePY后的开发目录)
    |   ├── components         WePY组件目录(组件不属于完整页面,仅供完整页面或其他组件引用)
    |   |   ├── com_a.wpy      可复用的WePY组件a
    |   |   └── com_b.wpy      可复用的WePY组件b
    |   ├── pages              WePY页面目录(属于完整页面)
    |   |   ├── index.wpy      index页面(经build后,会在dist目录下的pages目录生成index.js、index.json、index.wxml和index.wxss文件)
    |   |   └── other.wpy      other页面(经build后,会在dist目录下的pages目录生成other.js、other.json、other.wxml和other.wxss文件)
    |   └── app.wpy            小程序配置项(全局数据、样式、声明钩子等;经build后,会在dist目录下生成app.js、app.json和app.wxss文件)
    └── package.json           项目的package配置
    

    5:进入myproject

    cd myproject
    

    6:安装依赖

    在新建的项目里面安装需要的依赖包

    npm  install
    

    安装完成之后可以看见,文件里面多出了两个依赖文件

     

    7:进行实时编译

    wepy build --watch
    

    8:在微信开发者工具打开

    可以看到,刚才创建的项目

     

    注意:因为小程序开发工具对wepy文件不太友好,无法直接在开发者工具里面打开,所以要另外选择编辑器编写代码,开发者工具可进行调试和查看效果

     

    ps:简书写文章的一个缺陷,就是有时候在上传markdown图片的过程中不能继续使用键盘,等图片上传好之后才可以,不然通篇文章都会消失,进入顶部重新编辑,遇到过两三次,编辑好的文章就这样消失了,头疼,只好又开始重新写一遍,权当是加深印象咯。

    原文作者:祈澈姑娘 技术博客:https://www.jianshu.com/u/05f416aefbe1
    90后前端妹子,爱编程,爱运营,文艺与代码齐飞,魅力与智慧共存的程序媛一枚。

    展开全文
  • 首先需要装 global-define这个插件 npm i babel-plugin-global-define --save-dev 然后在wepy.config.js里就可以配置全局变量了 ...npm run dev //开发环境 npm run build //生产环境 然后你就...
  • scr下面创建config文件夹 并创建dev.js prod.js index.js三个文件 ... url: '开发环境url' } prod.js export default { url: '正式环境url' } index.js ``` import devConf from './dev' import prodC...
  • 安装环境 安装 Vue.js 下载 安装 (直接next就可以了,当然需要指定安装目录) 打开 win+R 输入cmd 选择这之中的一个打开 更换镜像源 淘宝npm镜像:由于默认使用的是国外的镜像,这会有时候导致下载vue时网速过...
  • 小程序框架wepy开发文档 wepy开源 wepy官方文档 1:安装node 端开发框架和环境都是需要 Node.js ,先安装node.js开发环境,WePY借鉴了Vue.js(后文简称Vue)的语法风格和功能特性,vue的运行是要依赖于node的npm的...
  • 小程序目前主流的开发框架有mpvue 和wepy 两种,由于wepy是腾讯自己开发的框架,所以先来简单了解一下wepywepy的作用主要是提高开发者的开发效率,采用了类似使用了vue的代码书写风格, 结合使用webwack提供的...
  • 小程序第一讲 wepy环境搭建写在前面的话准备node和npm环境WePY项目的创建与使用WePY项目的目录结构参考建议添加项目代码高亮结束语 写在前面的话 wepy的官方文档已经很详细了,为啥我还要啰嗦写下这篇文章。我想说的...
  • 笔者不太习惯使用微信提供的微信小程序开发工具,所以找了一些教程及资料,希望通过webstorm开发微信小程序。在环境配置过程中碰到也解决了一些问题,下面记录一下经验,以防以后忘记。 1.下载webstorm及node.js ...
  • 基于微信小程序的小程序商城买家端,采用wepy框架开发; 项目实现了基本的商城功能; 目前后端数据是基于easy-mock的随机模拟数据,且页面只开放了少部分功能; 目前只对接了部分接口,如果接口报错404,说明该接口...
  • 小程序框架wepy开发文档 wepy开源 wepy官方文档 微信小程序wepy框架资源汇总 在之前,已经准备好几个源码 现在要运用的是wepy仿微信聊天界面 多看看源码,然后动手做一下 差不多就可以了解一二了 查看并运行源码-...
  • 项目环境(开发环境,测试环境,预发环境,线上环境) 原公司小程序环境使用非常奇怪 (测试体验版为测试环境)(正式版体验版为预发环境) 现又新增开发环境,那么在使用的时候岂不是每切换一个环境都的重新打包...
  • 如何使用wepy和 vant-weapp开发小程序

    千次阅读 2019-04-22 15:51:00
    这里记录一下 使用wepy框架和 vant-weapp库开发小程序废话 不多说 wepy文档:https://tencent.github.io/wepy/document.html#/ vant-weapp 文档https://youzan.github.io/vant-weapp/#/quickstart1 安装环境全局...
  • 小程序框架wepy开发文档 wepy开源 wepy官方文档 微信小程序wepy框架资源汇总 在之前,已经准备好几个源码 现在要运用的是wepy仿微信聊天界面 多看看源码,然后动手做一下 差不多就可以了解一二了 查看并运行源码-...
  • 微信小程序开发流程 初始化 前置条件 服务端完成相应的接口开发 申请小程序个人帐号 ...小程序基础环境 初始化WePY 原生格局 配置 json 模板 wxml 样式 wxss 交互逻辑 js 安装WePY php // 全局安装或...
  • 在搭建小程序wepy开发环境的时候,有时候会遇到一些报错,不过没关系,属于正常现象,稍微耐心一些,百度一下,就可以解决啦。 当在D盘输入命令,全局安装wepy时候。 npm install wepy-cli -g 有时候会报出这样的...
  • 在搭建小程序wepy开发环境的时候,有时候会遇到一些报错,不过没关系,属于正常现象,稍微耐心一些,百度一下,就可以解决啦。 当在D盘输入命令,全局安装wepy时候。 npm install wepy-cli -g 有时候会报出这样...
  • 在搭建小程序wepy开发环境的时候,有时候会遇到一些报错,不过没关系,属于正常现象,稍微耐心一些,百度一下,就可以解决啦。 当在D盘输入命令,全局安装wepy时候。 npm install wepy-cli -g 有时候会报出这样的...
  • 前提有node和npm环境 1.全局安装WePY命令行工具 npm install wepy-cli -g 2.创建项目 wepy init standard mywepy 3.同IDE打开项目安装依赖包 npm install 4.添加项目配置https://weapp.iviewui.com/一套高质量的...
  • 主要是windows平台缺少编译环境,1、先运行: npm install -g node-gyp2、然后运行cmd:(右键点击:以管理员身份运行) 输入:npm install --global -production windows-build-tools 成功图: 3.在项目根...
  • wepy框架入门教程

    千次阅读 2019-05-27 16:57:05
    小程序框架wepy开发文档 wepy开源 wepy官方文档 ###1:安装node 端开发框架和环境都是需要 Node.js ,先安装node.js开发环境,WePY借鉴了Vue.js(后文简称Vue)的语法风格和功能特性,vue的运行是要依赖于node的...
  • 小程序框架wepy开发文档 wepy开源 wepy官方文档 在之前,已经准备好几个源码 现在要运用的是wepy仿微信聊天界面 多看看源码,然后动手做一下 差不多就可以了解一二了 查看并运行源码-wepy仿微信聊天界面 ...
  • 怎么运行项目wepy源码

    2019-03-21 14:35:29
    小程序框架wepy开发文档 wepy开源 wepy官方文档 在之前,已经准备好几个源码 现在要运用的是wepy仿微信聊天界面 多看看源码,然后动手做一下 差不多就可以了解一二了 查看并运行源码-wepy仿微信聊天界面...
  • 小程序框架wepy2.x

    2020-09-02 14:52:16
    小程序框架wepy 2.x开发总结 一: 项目创建 安装node环境(node.js官方下载地址) 全局安装wepy2.x: # npm install @wepy/cli -g 项目初始化: # wepy init standard myproject (命令wepy list可查看模板列表) ...
  • 便捷应用成为了小程序的标签,那么作为开发者如何完成快速高质量的开发呢?一个基于wepy、weui、redux的脚手架成为我们开发者迈出第一步的基石。 环境安装 wepy脚手架 安装wepy-clinpm install wepy-cli -g 初始...

空空如也

空空如也

1 2 3 4
收藏数 62
精华内容 24
关键字:

wepy开发环境