收藏
评论

小程序支持组件化开发的框架 wepy

介绍

WePY 是一款让小程序支持组件化开发的框架,通过预编译的手段让开发者可以选择自己喜欢的开发风格去开发小程序。框架的细节优化,Promise,Async Functions的引入都是为了能让开发小程序项目变得更加简单,高效。

同时WePY也是一款成长中的框架,大量吸收借鉴了一些优化前端工具以及框架的设计理念和思想。如果WePY有不足地方,或者你有更好的想法,欢迎提交ISSUE或者PR。

特性:

  • 类Vue开发风格

  • 支持自定义组件开发

  • 支持引入NPM包

  • 支持Promise

  • 支持ES2015+特性,如Async Functions

  • 支持多种编译器,Less/Sass/Styus、Babel/Typescript、Pug

  • 支持多种插件处理,文件压缩,图片压缩,内容替换等

  • 支持 Sourcemap,ESLint等

  • 小程序细节优化,如请求列队,事件优化等


WePY

npm version travis-ci Coverage Status Dependency Status

<p align="center"> <p align="center"></p> <p align="center"></p> <p align="center"></p>

<p align="center"> <img src="https://cloud.githubusercontent.com/assets/2182004/23608978/d42cd6c8-02a6-11e7-9f2e-eda22a9737c7.png" alt="qrcode"> </p>

<p align="center"> WePY 交流群已满500人,请加 gcaufy-helper 好友或者扫码加好友,验证回复 wepy 按照指引进群。 </p> </p>

介绍

WePY 是一款让小程序支持组件化开发的框架,通过预编译的手段让开发者可以选择自己喜欢的开发风格去开发小程序。框架的细节优化,Promise,Async Functions的引入都是为了能让开发小程序项目变得更加简单,高效。

同时WePY也是一款成长中的框架,大量吸收借鉴了一些优化前端工具以及框架的设计理念和思想。如果WePY有不足地方,或者你有更好的想法,欢迎提交ISSUE或者PR。

特性:

  • 类Vue开发风格
  • 支持自定义组件开发
  • 支持引入NPM包
  • 支持Promise
  • 支持ES2015+特性,如Async Functions
  • 支持多种编译器,Less/Sass/Styus、Babel/Typescript、Pug
  • 支持多种插件处理,文件压缩,图片压缩,内容替换等
  • 支持 Sourcemap,ESLint等
  • 小程序细节优化,如请求列队,事件优化等

Demo

<style lang="less">
    @color: #4D926F;
    .userinfo {
        color: @color;
    }
</style>
<template lang="pug">
    view(class='container')
        view(class='userinfo' @tap='tap')
            mycom(:prop.sync='myprop' @fn.user='myevent')
            text {{now}}
</template>

<script>
    import wepy from 'wepy';
    import mycom from '../components/mycom';

    export default class Index extends wepy.page {
        
        components = { mycom };
        data = {
            myprop: {}
        };
        computed = {
            now () { return +new Date(); }
        };
        async onLoad() {
            await sleep(3);
            console.log('Hello World');
        }
        sleep(time) {
            return new Promise((resolve, reject) => setTimeout(() => resolve, time * 1000));
        }
    }
</script>

安装使用

安装(更新) wepy 命令行工具。

npm install wepy-cli -g

生成开发示例

wepy new myproject

开发实时编译

wepy build --watch

开发者工具使用

  1. 使用微信开发者工具新建项目,本地开发选择dist目录。
  2. 微信开发者工具-->项目-->关闭ES6转ES5。<font style="color:red">重要:漏掉此项会运行报错。</font>
  3. 微信开发者工具-->项目-->关闭上传代码时样式自动补全 <font style="color:red">重要:某些情况下漏掉此项会也会运行报错。</font>
  4. 微信开发者工具-->项目-->关闭代码压缩上传 <font style="color:red">重要:开启后,会导致真机computed, props.sync 等等属性失效。#270</font>
  5. 项目根目录运行wepy build --watch,开启实时编译。

哪些小程序是用 WePY 开发的

阅邻二手书、 深大的树洞、 手机充值+、 爱羽客羽毛球、 小小羽球、 七弦琴大数据、 七弦琴小助手、 培恩医学、 公务员朝夕刷题、 独角兽公司、 逛人备忘、 英语助手君、 农资优选、 花花百科、 斑马小店、 鲜花说小店、 ...

Links

Documentation

Changelog

Contributing

License MIT

收藏

20 个评论

  • 郭永龙
    郭永龙
    2018-07-07

    不得不说,wepy的很多写法还是不错的。


    选择wepy就是因为与小程序同一个厂的产品,但我感觉修复bug方面速度太慢,而小程序不断更新,导致没体现使用框架的优势。


    一部分坑:

    1. 组件化限制太大,props传递都会相互污染,毕竟循环使用场景太频繁

    2. 很多bug在文档中不体现,导致花了很多时间脱坑

    3. 1.7.2支持原生组件,但一直无效

    4. 示范性组件质量一般,并且不多

    5. 太小的点,就不说了,后面略


    目前考虑用回原生写法,希望大大早日优化好

    2018-07-07
    赞同 3
    回复 4
    • 鹏
      2018-07-24

      同感,目前就在用wepy,用的越多,越觉得的别扭

      2018-07-24
      2
      回复
    • 中华小当家
      中华小当家
      2018-09-21回复

      同感

      2018-09-21
      回复
    • Applet
      Applet
      2018-12-04

      个人感觉 微信更新那么快 现有的框架没上手,可能好多功能就不适用了,应该放开插件机制,这样才能像vue一样便于开发者开发

      2018-12-04
      回复
    • 2019-03-01

      大佬们现在还在用wepy吗,有什么合适的框架推荐吗

      2019-03-01
      回复
  • Lanten
    Lanten
    2018-08-23

    这个玩意就是个坑,能劝退一个是一个

    2018-08-23
    赞同 2
    回复
  • 峥
    2019-02-15

    *****************                             该评论已被屏蔽    --- 微信团队

    2019-02-15
    赞同 1
    回复
  • 梁海涛
    梁海涛
    2019-03-01

    学习永无止境,对程序的爱好始终如一,我的开源项目

    https://github.crmeb.net/u/demo

    一起和大神学习交流



    2019-03-01
    赞同
    回复
  • h
    h
    2019-02-09

    微信交流 zhaohe012

    2019-02-09
    赞同
    回复
  • homhom
    homhom
    2019-01-07

    t

    2019-01-07
    赞同
    回复
  • TFL
    TFL
    2018-11-07

    说好的支持编译web呢?怎么文档和社区都没有?wepy --out web 编译出来两个文件,Index.html、index.js 。用浏览器打开一堆错误。根本跑不起来,哪位大神来解答?

    2018-11-07
    赞同
    回复
  • stoneFire
    stoneFire
    2018-09-06

    推荐wxapp-webpack-plugin这个插件,只是可以配合webpack使用,这样就可以使用less等插件,其他的组件化原生已支持,如果没有一份代码多端复用的需求下,不建议用任何其他封装过发框架,坑太多,如果是节省学习成本的话,那如果想做得好还是要学习原生小程序开发。所以对于大多数没有同时要开发一个web端的公司来说,用这些框架基本上没有任何好处

    2018-09-06
    赞同
    回复
  • 旅图
    旅图
    2018-02-06

    该评论已被删除

    2018-02-06
    赞同
    回复
  • 南
    2017-11-24

    大水们,我想找到,原生微信小程序什么时候支持dom操作

    2017-11-24
    赞同
    回复

正在加载...

登录 后发表内容