weweb是一个兼容小程序语法的前端框架，你可以使用小程序的编写方式来编写单面的web应用。如果您已经有一个小程序，您可以通过它在浏览器中运行您的小程序。在小程序流行的今天，它可以让你的小程序代码最大化。具有以下优点：跨平台，一套代码可以运行在多个终端（小程序，h5，以后直接打包成安卓和iosapp都不是梦）有自己的通用组件，完美继承小程序内置组件，兼容小程序rpx语法，让页面更容易适配各种机型。本项目基于小程序开发者工具内置的小程序运行框架。仔细研究了小程序官方的底层框架，实现了小程序运行在web端的服务和视图引擎。为了让【weweb】适应web端的性能需求，与小程序原生框架相比，主要调整如下：framework核心库减少了很多，与web无关的部分已被淘汰，使核心库体积大大减少。原有的三层架构简化为Service和View两层架构的页面资源，框架内置组件不常用。核心库大小提升加载速度支持自定义登录页面，替代微信登录功能去除小程序页面层级限制实现js版wxml和wxss编译器，满足跨平台编译需求，无缝集成到web应用场景喜欢小程序的开发方式，或者只了解小程序的开发，想通过小程序的开发来编写web应用。小程序开发者工具调试浏览器端小程序的部分功能。开发方法可以直接套用你之前开发小程序的方式，不需要额外的学习成本。只有开发好小程序后，才可以使用以下两种方式：一种运行方式，将小程序编译转换成对应的h5应用，然后把编译好的代码丢到服务器上运行。请先在系统中安装node，官方安装包会同时为您安装依赖管理工具npm。方法一：使用cli命令行工具直接转换安装小程序：npminstallweweb-cli-g运行示例：#./demos/demo20170111/这是小程序weweb的存放路径./demos/demo20170111/Options:-h,--help输出帮助信息-V,--version输出版本信息-o,--open使用Chrome打开小程序，只对Mac有效-l,--list使用默认浏览器打开更新历史-p,--port指定服务端口，默认为2000-d,--dist指定生成路径Path-t,--transform只转换小程序，不转换web服务方法二：手动构建运行：#clone[weweb]项目并安装依赖npmi#构建核心库：npmrunbuild#运行示例：./bin/weweb./demos/demo20170111/#压缩app代码：使用环境变量NODE_ENV=productionNODE_ENV=production./bin/wewebdemos/demo20170111#替换编译器：使用环境变量DFT_CMP=true出现默认编译错误时切换到微信开发内置编译器DFT_CMP=true./bin/wewebdemos/demo20170111#环境变量可以结合使用NODE_ENV=productionDFT_CMP=true./bin/wewebdemos/demo20170111在线demodemomo小程序二维码如下：点这里查看weweb编译的h5在线demo，比较小程序和转换后生成的h5应用程序的区别【demo源码】stage在审判阶段，有些案件可能没有得到充分的检验。如果大家在使用weweb的过程中发现了一些异常，可以尝试切换到官方的微信编译器看看能否解决问题。如果你有类似的问题，欢迎提出[issue]。我们会尽快修复#切换到微信开发者工具自带的编译器：使用环境变量DFT_CMP=true如下：DFT_CMP=true./bin/wewebdemos/demo20170111转换成H5后会有跨域访问接口和脱离微信环境带来一些API无法支持的问题。我们可以通过在小程序的app.json文件中添加weweb配置项来解决一些常见的问题：Login：转为H5后，将不再支持小程序原有的登录方式，可以使用loginUrl项来设置调用wx.login跳转到登录页面/***这里的loginUrl地址必须是app.json中注册的小程序地址*/"weweb":{"loginUrl":"/page/H5login"}登录成功后调用wx.loginSuccess();这个api可以自动返回源码页面示例代码：success:function(rt){if(rt.result){varlogin=require("../../modules/login/index.js");app.globalData.userInfo=rt.result;login.setLoginInfo(rt.result);wx.loginSuccess();}else{toast.show(self,rt.status.status_reason||'登录失败');}}跨域请求：当后端接口不支持JSONP时，可以添加requestProxy配置itemtosettheserver-sideproxyaddresstoachievecross-domainrequests/***这里的/remoteProxy是web服务器接口实现的代理*实际项目中请改成自己真实的代理地址。如果接口支持返回jsonp格式，则不需要这个配置*/"weweb":{"requestProxy":"/remoteProxy"}小程序转h5的效果可以看出，转H5后，依赖的相关接口不支持微信环境。比如：登录等，需要转化为H5兼容模式。小程序转H5后，特殊情况下，部分样式可能会出现异常。得自己调，最后放到我们的github地址https://github.com/wdfe/web上。
