Merge pull request #98 from wechat-miniprogram/feat-glass-easel

Add support for glass-easel

Author: LastLeaf

.eslintrc.js

@@ -2,38 +2,40 @@ module.exports = {
   root: true,
   parser: '@typescript-eslint/parser',
   parserOptions: {
-    ecmaVersion: 6,
+    ecmaVersion: 9,
+    ecmaFeatures: {
+      jsx: false,
+    },
     sourceType: 'module',
   },
   env: {
     es6: true,
-    browser: true,
+    node: true,
     jest: true,
     commonjs: true,
-    node: true,
   },
-  plugins: ['@typescript-eslint'],
-  extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'],
   globals: {
-    wx: true,
+    window: true,
+    document: true,
     App: true,
     Page: true,
     Component: true,
     Behavior: true,
+    wx: true,
   },
+  plugins: ['@typescript-eslint', 'prettier'],
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/eslint-recommended',
+    'plugin:@typescript-eslint/recommended',
+    'prettier/@typescript-eslint',
+  ],
   rules: {
-    'no-console': 0,
+    'prettier/prettier': 'error',
     '@typescript-eslint/ban-ts-ignore': 'off',
     '@typescript-eslint/no-empty-function': 'off',
     '@typescript-eslint/explicit-function-return-type': 'off',
     '@typescript-eslint/no-explicit-any': 'off',
     '@typescript-eslint/no-non-null-assertion': 'off',
-    indent: ['error', 2, { SwitchCase: 1 }],
-    'comma-spacing': 'error',
-    semi: ['error', 'never'],
-    quotes: ['error', 'single'],
-    'object-curly-spacing': ['error', 'always'],
-    '@typescript-eslint/ban-ts-comment': 'off',
-    "@typescript-eslint/interface-name-prefix": 'off'
   },
 }

.github/workflows/node.js.yml

@@ -5,27 +5,26 @@ name: Node.js CI
 
 on:
   push:
-    branches: [ "master" ]
+    branches: ['master']
   pull_request:
-    branches: [ "master" ]
+    branches: ['master']
 
 jobs:
   build:
-
     runs-on: ubuntu-latest
 
     strategy:
       matrix:
-        node-version: [12.x, 14.x, 16.x]
+        node-version: [16.x, 20.x]
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
     steps:
-    - uses: actions/checkout@v3
-    - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v3
-      with:
-        node-version: ${{ matrix.node-version }}
-        cache: 'npm'
-    - run: npm i
-    - run: npm run build --if-present
-    - run: npm test
+      - uses: actions/checkout@v3
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: 'npm'
+      - run: npm i
+      - run: npm run build --if-present
+      - run: npm test

.prettierrc.js

@@ -0,0 +1,16 @@
+module.exports = {
+  printWidth: 100,
+  tabWidth: 2,
+  useTabs: false,
+  semi: false,
+  singleQuote: true,
+  quoteProps: 'as-needed',
+  trailingComma: 'all',
+  bracketSpacing: true,
+  arrowParens: 'always',
+  requirePragma: false,
+  insertPragma: false,
+  proseWrap: 'preserve',
+  endOfLine: 'lf',
+  embeddedLanguageFormatting: 'auto',
+}

.swcrc

@@ -1,29 +1,29 @@
 {
-    "jsc": {
-        "parser": {
-            "syntax": "typescript",
-            "tsx": false,
-            "decorators": false,
-            "dynamicImport": false
-        },
-        "transform": null,
-        "target": "es5",
-        "loose": true,
-        "externalHelpers": false,
-        "keepClassNames": false,
-        "minify": {
-            "compress": {
-                "unused": true
-            },
-            "mangle": true
-        }
+  "jsc": {
+    "parser": {
+      "syntax": "typescript",
+      "tsx": false,
+      "decorators": false,
+      "dynamicImport": false
     },
-    "minify": true,
-    "module": {
-        "type": "commonjs",
-        "strict": false,
-        "strictMode": true,
-        "lazy": false,
-        "noInterop": false
+    "transform": null,
+    "target": "es5",
+    "loose": true,
+    "externalHelpers": false,
+    "keepClassNames": false,
+    "minify": {
+      "compress": {
+        "unused": true
+      },
+      "mangle": true
     }
-}
+  },
+  "minify": true,
+  "module": {
+    "type": "commonjs",
+    "strict": false,
+    "strictMode": true,
+    "lazy": false,
+    "noInterop": false
+  }
+}

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2018 wechat-miniprogram
+Copyright (c) 2018-2024 wechat-miniprogram
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -4,13 +4,13 @@
 
 > 此 behavior 依赖开发者工具的 npm 构建。具体详情可查阅[官方 npm 文档](https://developers.weixin.qq.com/miniprogram/dev/devtools/npm.html)。
 
-注意： 4.0.0 大版本变更了最基本的接口名，升级到 4.0.0 以上时请注意 [#60](https://github.com/wechat-miniprogram/computed/issues/60) 的问题。旧版文档可以参考对应版本的 git tag 中的 README ，如 [v3.1.1](https://github.com/wechat-miniprogram/computed/tree/v3.1.1) tag 。
+注意： 4.0.0 大版本变更了最基本的接口名，从低版本升级到 4.0.0 以上时请注意 [#60](https://github.com/wechat-miniprogram/computed/issues/60) 的问题。
 
 ## 使用方法
 
 ### 方式一 代码片段
 
-需要小程序基础库版本 >= 2.6.1 的环境。
+需要小程序基础库版本 >= 2.11.0 的环境。
 
 可以直接体验一下这个代码片段，它包含了基本用法示例：[https://developers.weixin.qq.com/s/4KYn6TmJ7osP](https://developers.weixin.qq.com/s/4KYn6TmJ7osP)
 
@@ -120,7 +120,33 @@ Component({
 <button bindtap="onTap">click</button>
 ```
 
-### TypeScript 支持
+### glass-easel Chaining API 支持
+
+使用 glass-easel Chaining API 时，可以用更友好的 `computed` `watch` 函数。
+
+```js
+import { computed, watch } from 'miniprogram-computed'
+
+Component()
+  .data(() => ({
+    a: 1,
+    b: 2,
+  }))
+  .init((ctx) => {
+    const data = computed(ctx, {
+      c: (data) => data.a + data.b,
+      d: (data) => data.a * 2,
+    }, {
+      e: (data) => data.c + data.d,
+    })
+    watch(ctx, 'a, b', (a: number, b: number) => {
+      // ...
+    })
+  })
+  .register()
+```
+
+### 非 chaining API 的 TypeScript 支持
 
 由于通过 behavior 的方式引入不能获得类型支持, 因此为了获得类型的支持, 可以使用一个辅助组件构造器：
 
@@ -162,42 +188,6 @@ ComponentWithComputed({
 
 针对此问题，推荐使用 `ComponentWithComputed` 构造器代替 `Component` 构造器。
 
-**关于类型声明**
-
-在 `4.0.5` 版本之前，并未提供相关的 `.d.ts` 类型声明。
-
-强烈建议将 `miniprogram-computed` npm 包依赖升级至 `^4.0.5` 已获取完整的类型能力。
-
-## ^4.0.0 与 ^1.0.0、 ^2.0.0、 ^3.0.0 版本的差异
-
-### ^4.0.0 版本
-
-- 变更了最基本的接口。
-
-- 新增简单的 TypeScript 支持。
-
-### ^3.0.0 版本
-
-- 支持 mobx-miniprogram 扩展库引入的数据段。
-
-- 对自定义 behavior 数据段使用 computed 时，支持在初始化视图中进行数据渲染。
-
-- 基于 proxy 更新了 computed 数据追踪的实现方式，computed 依赖的数据路径追踪初始化操作，延后到组件的 created 阶段 。
-
-### ^2.0.0 版本
-
-基于小程序基础库 2.6.1 开始支持的 observers 定义段实现，具有较好的性能。
-
-以下是版本之间主要区别的比较。
-
-| 项目                                            | ^1.0.0          | ^2.0.0        | ^3.0.0 和 ^4.0.0 |
-| ----------------------------------------------- | --------------- | ------------- | ---------------- |
-| 支持的基础库最低版本                            | 2.2.3           | 2.6.1         | 2.6.1            |
-| 支持 `watch` 定义段                             | 否              | 是            | 是               |
-| 性能                                            | 相对较差        | 相对较好      | 相对较好         |
-| 支持 `mobx-miniprogram` 扩展库                  | 不支持          | 不支持        | 支持             |
-| 支持自定义 `behavior` 数据字段 / 初始化视图渲染 | 不支持 / 不支持 | 支持 / 不支持 | 支持 / 支持      |
-
 ## 常见问题说明
 
 ### 我应该使用 computed 还是 watch ？
@@ -212,7 +202,7 @@ ComponentWithComputed({
 
 ### 关于 \*\* 通配符
 
-在 `watch` 字段上可以使用 `**` 通配符，是它能够监听这个字段下的子字段的变化（类似于小程序基础库本身的 observers ）。
+在 `watch` 字段上可以使用 `**` 通配符，它能够监听这个字段下的子字段的变化（类似于小程序基础库本身的 observers ）。
 
 ```js
 const computedBehavior = require('miniprogram-computed').behavior
@@ -246,7 +236,3 @@ Component({
 
 - 对于没有使用 `**` 通配符的字段，在 `watch` 检查值是否发生变化时，只会进行粗略的浅比较（使用 `===` ）；
 - 对于使用了 `**` 通配符的字段，则会进行深比较，来尝试精确检测对象是否真的发生了变化，这要求对象字段不能包含循环（类似于 `JSON.stringify` ）。
-
-### 关于低版本兼容
-
-对于 IOS `9.3` 以下的版本，由于无法原生支持 `Proxy`，这里会使用 `proxy-polyfill` 去代替。

UPDATE.md

@@ -25,15 +25,20 @@
 - 使用 TypeScript 重构。
 - 优化部分生命周期逻辑。
 
-# 4.1.1
+## 4.1.1
 
 - 优化打包方式
 - 优化 dev 开发流程
 
-# 4.2.x
+## 4.2.x
 
 - 增加 polyfill
 
-# 4.3.x
+## 4.3.x
 
 - 修复引用类型的部分问题
+
+## 5.0.0
+
+- 基于 glass-easel 重构
+- 支持 chaining API