minapp

v1.0.0 发布

March 10, 2018

Mora

minapp 提供微信小程序开发过程中的一整套解决方案， 包括应用层框架，编译器，及在 vscode 上开发的完美体验，更多介绍可以查看 minapp 官网

经过前面几个小版本的迭代， minapp 正式发布 1.0.0 版本了，新增功能如下：

框架更新：

更智能的 setData 函数： setDataSmart

在页面处于隐藏状态下，原生的 setData 函数也会将 data 应用到页面中，导致隐藏的页面也更新；而 setDataSmart 会自动检测当前页面状态，当页面处于隐藏状态时，会将需要更新的 data 缓存起来，等到页面处于显示状态时，再统一更新，可以优化页面性能！

另外，如果要使用数据双向绑定，也必须使用 setDataSmart，而不是 setData（见下条）

支持数据双向绑定

只需要在模板的属性名后面加上 .sync ，并将 js 中的 setData 换成 setDataSmart，就可以实现双向绑定，如：

  • wxml 模板中可以这样写
<child childAttr.sync="parentAttr" />
  • 组件中只需要将 setData 换成 setDataSmart
onLoad() {
  this.setDataSmart({
    childAttr: 'foo'
  })
}

实现原理查看文章 如何在原生的小程中实现数据双向绑定

mobx 不再是必须的，可以选择不使用 mobx

上一版本中框架和 mobx 融合在一起了，有不少人提出不用 mobx 该怎么做。所以现在将 @minapp/mobx 拆分了，将原来的系统结构放到了 @minapp/core 中，@minapp/mobx 专门负责将 mobx 集成到 @minapp/core 中。如此，以后也有可能提供更多的状态管理组件！

所以现在 @minapp/core 可以有如下三种用途：

  1. 只需要 wx API 的自动补全：只需要将文件 @minapp/core/typing/wx.d.ts 包含在你的项目中
  • 可以通过 reference 引用 
    /// <reference path="path/to/@minapp/core/typing/wx.d.ts" />
  • 也可以在你的 jsconfig.json 或 tsconfig.json 文件中 include 此文件
  1. 需要 wx 和 wxp API 的自动补全，但不想要 minapp 提供的框架：import wxp 模块即可
import {wxp} from '@minapp/core/wxp' // 注意后面要加上 wxp
  1. 需要 minapp 的框架：import 整个项目即可，里面含有所有你需要的函数
import {wxp, BasePage, BaseComponent /* ... */ } from '@minapp/core'

全新的组件开发模式

除了创建小程序应用之外，现在可以创建单个小程序的组件，并且可以将其发布在 npm 上， 在小程序应用中可以直接安装并引用它，并且，自定义组件在最新的 minapp-vscode 插件中可以智能提醒！

  • 使用 npm 组件示例 component-develop

样式语言也支持自定义

上一版本中默认只会生成 scss 样式文件，现在支持自定义样式语言， 支持的样式有：scss、less、css、wxss。

增加配置文件 minapp.json

目前只暴露了极少的配置选项在配置文件中，后续考虑添加更多配置。

另外在组件开发模式下，此配置文件是必须的，需要在配置文件中指定组件所在的路径； 非组件开发模式下可以不用此配置文件，系统都有默认的选项。

官方接口更新

在最近的官方更新中，更新了一大批 api 和 组件，所以 minapp 的 wx.d.ts、 wxp.d.ts 和 components.json 也对应更新了

minapp-vscode 插件更新：(下载地址)

上一版本已经实现了官方组件名称和所有组件属性的自动补全，如今，又带来了更多改善开发体验的功能：

属性值也可以自动补全了

示例图片

根据已有属性，自动筛选出对应支持的属性集合

  • 当 picker 的 mode="selector" 时，有 range 和 range-key 的属性
  • 当 picker 的 mode="time" 时，有 start 和 end 的属性
  • ...

示例图片

自定义组件自动补全

  • 自动获取对应 json 文件中的组件信息
  • 优先提示自定义组件
  • 自动获取组件中属性的描述

示例图片

Recent Posts