@ray-js/smart-ui 2.4.0-beta-5 → 2.4.0-beta-7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/README-zh_CN.md +5 -1
  2. package/README.md +29 -8
  3. package/package.json +2 -2
package/README-zh_CN.md CHANGED
@@ -41,7 +41,11 @@ export default function Demo() {
41
41
  ## 动态按需引入（推荐）
42
42
  考虑到项目的按需引入以及整体体积问题，上面的引入方式会导致部分组件样式文件残留影响打包产物体积，所以我们推荐使用按需引入插件，其会自动将 `import { Button } from '@ray-js/smart-ui';` 引入方式解析成 `import Button from '@ray-js/smart-ui/es/button';`。
43
43
 
44
- 1. 升级 @ray-js/ray 和 @ray-js/ray 到 1.8.0 及以上版本
44
+ 1. 环境要求
45
+ * \>= @ray-js/cli@1.7.4
46
+ * esbuild 构建模式 (不支持 webpack 模式)
47
+ * 使用 ESModule import 语法的导入
48
+ * **SmartUI 版本 2.4.0 及以上**
45
49
 
46
50
  2. 在项目文件 ray.config.ts 内引入 SmartUIAutoImport 即可：
47
51
  ```ts
package/README.md CHANGED
@@ -4,17 +4,17 @@ English | [简体中文](./README-zh_CN.md)
4
4
 
5
5
  ## Introduction
6
6
 
7
- `@ray-js/smart-ui` is a React component library based on the `Ray` framework and `@tuya-miniapp/smart-ui`, aimed at providing lightweight and reliable UI components that adhere to the design specifications for smart mini programs on mobile devices. By combining the `Ray` specification adaptation layer and built-in comprehensive TypeScript types, we offer a complete set of React components suitable for smart mini programs, allowing developers to quickly build mobile applications that meet design standards.
7
+ `@ray-js/smart-ui` is a React component library based on the `Ray` framework and `@tuya-miniapp/smart-ui`, designed to provide lightweight and reliable UI components that comply with the mobile design specifications for smart mini programs. By integrating Ray's specification adaptation intermediary layer and built-in perfect TS types, we offer a full set of React components suitable for smart mini programs, enabling developers to quickly build mobile applications that meet design specifications.
8
8
 
9
9
  ## Preview
10
10
 
11
- Scan the QR code below with your smart mini program to experience the component library demo.
11
+ Scan the QR code below for the smart mini program to experience the component library demo.
12
12
 
13
- <img src="https://images.tuyaus.com/content-platform/hestia/1716260412b7f2ae02271.png" width="200" height="200">
13
+ <img src="https://images.tuyacn.com/content-platform/hestia/1716260412b7f2ae02271.png" width="200" height="200">
14
14
 
15
- ## Before Getting Started
15
+ ## Before Using
16
16
 
17
- Before using Smart UI, make sure you have already studied the [Ray Development Overview](https://developer.tuya.com/en/miniapp/develop/ray/guide/overview) and [Ray Component Introduction](https://developer.tuya.com/en/miniapp/develop/ray/framework/component) from the smart mini program official documentation.
17
+ Before using Smart UI, please ensure you have studied the official [Ray Development Overview](https://developer.tuya.com/cn/miniapp/develop/ray/guide/overview) and [Ray Component Introduction](https://developer.tuya.com/cn/miniapp/develop/ray/framework/component) for smart mini programs.
18
18
 
19
19
  ## Installation
20
20
 
@@ -28,7 +28,7 @@ npm i @ray-js/smart-ui
28
28
 
29
29
  ## Using Components
30
30
 
31
- Using the button component as an example:
31
+ Taking the button component as an example
32
32
 
33
33
  ```jsx
34
34
  import { Button } from '@ray-js/smart-ui';
@@ -38,6 +38,27 @@ export default function Demo() {
38
38
  }
39
39
  ```
40
40
 
41
+ ## Dynamic Import on Demand (Recommended)
42
+ Considering the project’s demand for dynamic import and overall package size concerns, the above import method might leave some component style files that impact the package size. Therefore, we recommend using the on-demand import plugin, which will automatically parse `import { Button } from '@ray-js/smart-ui';` into `import Button from '@ray-js/smart-ui/es/button';`.
43
+
44
+ 1. Environment Requirements
45
+ * \>= @ray-js/cli@1.7.4
46
+ * esbuild build mode (does not support webpack mode)
47
+ * Use of ESModule import syntax for importing
48
+ * **SmartUI version 2.4.0 and above**
49
+
50
+ 2. Simply import SmartUIAutoImport within the ray.config.ts project file:
51
+ ```ts
52
+ import { RayConfig } from '@ray-js/types';
53
+ import SmartUIAutoImport from '@ray-js/smart-ui/lib/auto-import';
54
+
55
+ const config: RayConfig = {
56
+ ...
57
+ importTransformer: [SmartUIAutoImport],
58
+ };
59
+ module.exports = config;
60
+ ```
61
+
41
62
  ## Preview in Developer Tools
42
63
 
43
64
  ```bash
@@ -49,8 +70,8 @@ Open [Tuya MiniApp Tools](https://developer.tuya.com/cn/miniapp/devtools/tools),
49
70
 
50
71
  ## Base Library Version
51
72
 
52
- @ray-js/smart-ui provides stable support starting from the smart mini program base library version `2.19.0` and `@ray-js/ray@^1.5.1`.
73
+ @ray-js/smart-ui provides stable support from the smart mini program base library version `2.19.0` `@ray-js/ray@^1.5.1` and IDE `0.6.5`.
53
74
 
54
75
  ## Open Source License
55
76
 
56
- This project is licensed under the [MIT](https://en.wikipedia.org/wiki/MIT_License) license. Feel free to enjoy and contribute to the open source community.
77
+ This project is based on the [MIT](https://zh.wikipedia.org/wiki/MIT%E8%A8%B1%E5%8F%AF%E8%AD%89) license. Please feel free to enjoy and participate in open source.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ray-js/smart-ui",
3
- "version": "2.4.0-beta-5",
3
+ "version": "2.4.0-beta-7",
4
4
  "description": "轻量、可靠的智能小程序 UI 组件库",
5
5
  "scripts": {
6
6
  "syncMiniappData": "node ./build/syncMiniappData.js",
@@ -42,7 +42,7 @@
42
42
  },
43
43
  "dependencies": {
44
44
  "@ray-js/components-ty-slider": "^0.3.3",
45
- "@tuya-miniapp/smart-ui": "^2.3.9",
45
+ "@tuya-miniapp/smart-ui": "2.4.0-beta-1",
46
46
  "lodash-es": "^4.17.21"
47
47
  },
48
48
  "devDependencies": {