微信小程序-WePY框架

WePY

WePY 框架在开发过程中参考了 Vue 等现有框架的一些语法风格和功能特性，对原生小程序的开发模式进行了再次封装，更贴近于 MVVM 架构模式, 并支持ES6/7的一些新特性。

• 开发风格：接近于 Vue.js，支持组件 Props 传值，自定义事件、组件分布式复用Mixin、计算属性函数computed、模板内容分发slot等等

• 组件化：组件化开发，完美解决组件隔离，组件嵌套，组件通信等问题

• NPM：支持使用第三方 npm 资源，自动处理 npm 资源之间的依赖关系，完美兼容所有无平台依赖的 npm 资源包

• Promise：通过 polyfill 让小程序完美支持 Promise，解决回调烦恼

• ES2015：可使用 Generator Fu-nction / Class / Async Function 等特性，大大提升开发效率

• 优化：对小程序本身的优化，如请求列对处理，优雅的事件处理，生命周期的补充，性能的优化等等

• 编译器：支持样式编译器：Less/Sass/Styus，模板编译器：wx-ml/Pug，代码编译器：Babel/Typescript。

• 插件：支持多种插件处理，如文件压缩，图片压缩，内容替换等，扩展简单,使用方便

• 框架大小：压缩后 24.3KB 即可拥有所有框架功能，额外增加 8.9 KB后即可使用 Promise 和 Async Function

配置WePY环境

一下以wePY1.7.3为例

一般按照WePY 1.X官方文档进行配置即可，但需要注意，npm进行安装的时候，可能因为墙的原因，获取数据十分缓慢，比如报错sill pacote range manifest for hmac-drbg@^1.0.0 fetched，这个时候，可以配置一下

npm config set registry  https://registry.npm.taobao.org  

再安装，就会很快了

开发IDE

VS Code

插件

代码高亮:Vetur-wepy

代码模式与组件化开发

作用:为了复用

加载第三方的npm包 (相当于第三方库)

在项目目录下，进行安装，比如，我们在这里安装mount

npm install mount

安装成功后，就可以在代码中调用了

比如，我们在index.wpy的script节点下进行使用

var moment = require('moment')
console.log(moment('1995-12-25'))

重新编译后(wepy build --watch) ，我们可以在微信开发者工具的Console上看到日志

npm库搜索 : https://www.npmjs.com/

WePY的编译原理

通过.wpy文件最终生成微信的.wxss、xwxml、.js、.json 这四个文件，实际上WePY就是做了一层包装

wepy.config.js配置文件说明

https://wepyjs.github.io/wepy-docs/1.x/#/?id=wepyconfigjs配置文件说明

wePY代码(脚本)说明

https://wepyjs.github.io/wepy-docs/1.x/#/?id=脚本部分介绍

其他

参考
https://blog.csdn.net/u010263035/article/details/80393393
https://www.cnblogs.com/fayin/p/7655620.html