tmui-cli 2.0.1 → 2.0.2

package/data/tmui4x/01./346/225/231/347/250/213/36./345/233/275/351/231/205/345/214/226.md

@@ -0,0 +1,220 @@
+---
+outline: deep
+---
+
+# 国际化配置
+
+### 前置说明
+
+国际化语言插件，采用的是原版VueI18n实现，具体见其官网，但我打了hack来兼容适配蒸汽版本的JS逻辑引擎。
+具体位置在 ```tmx-ui/libs/vue-i18n.js```。后续你如果要升级可以下载原版本直接替换。
+
+----
+
+安装语言包
+
+```ts
+
+import App from './App'
+import Xui from "@/uni_modules/tmx-ui"
+
+//多语言配置类型
+import {Tmui4xOptions} from "@/uni_modules/tmx-ui"
+//下方是组件内部的语言包
+import en from "@/uni_modules/tmx-ui/localLanuage/en.json"
+import zhHans from "@/uni_modules/tmx-ui/localLanuage/zh-Hans.json"
+import zhHant from "@/uni_modules/tmx-ui/localLanuage/zh-Hant.json"
+import ko from "@/uni_modules/tmx-ui/localLanuage/ko.json"
+import ja from "@/uni_modules/tmx-ui/localLanuage/ja.json"
+//如果你有自己的语言包，你也可以像上面那样导入语言，然后与组件的语言合并。或者你自己新增个语言进去。
+// 下方是组件的语言包，以及你自己定义的语言包与组件合并即可。共用一个实例。
+const messages : UTSJSONObject = {
+	"en":{
+		...en,
+		"hellow":"Hi~"
+	},
+	"zh-Hans":{
+		...zhHans,
+		"hellow":"哈喽"
+	},
+	"zh-Hant":zhHant,
+	"ko":ko,
+	"ja":ja
+}
+import { createSSRApp } from 'vue'
+export function createApp() {
+	const app = createSSRApp(App)
+	// 配置语言包
+	app.use(xui,{i18nOptions:{locale:"zh-Hans",messages},config:null} as Tmui4xOptions)
+	return {
+		app
+	}
+}
+
+```
+
+### 在任意Uts中使用
+
+```uts
+
+import { xConfig } from "@/uni_modules/tmx-ui"
+// i18n 实例（带类型）
+const i18n = xConfig.i18n!
+console.log(i18n.t('xx.x'))
+```
+
+### 在Uvue内使用
+
+#### 1.组合式模板内
+```ts
+
+import { xConfig } from "@/uni_modules/tmx-ui"
+// i18n 实例（带类型）
+const i18n = xConfig.i18n!
+console.log(i18n.t('xx.x'))
+```
+uts内导入后可以在模板内使用
+```vue
+
+<x-text>{{i18n.t('xx.x')}}</x-text>
+```
+
+### i18n实例方法
+
+如果想要看每一个方法的示例，见插件目录内的readme.md文档，有详细的测试案例。
+
+```ts
+
+export type I18nGlobal = {
+	/** 翻译文本。`t(key)` / `t(key, named)` / `t(key, list)` / `t(key, plural)` 多重载 */
+	t: (key: string, ...args: any[]) => string;
+	/** 解析已编译消息（rt: resolve translation），通常配合 tm() 使用 */
+	rt?: (message: any, ...args: any[]) => string;
+	/** 日期/时间格式化。`d(value)` / `d(value, key)` / `d(value, key, locale)` / `d(value, options)` */
+	d?: (value: any, ...args: any[]) => string;
+	/** 数字格式化。`n(value)` / `n(value, key)` / `n(value, key, locale)` / `n(value, options)` */
+	n?: (value: any, ...args: any[]) => string;
+	/** 判断 key 是否存在 */
+	te?: (key: string, locale?: string) => boolean;
+	/** 取整段消息子树（返回对象/数组结构） */
+	tm?: (key: string) => any;
+
+	/** 当前语言（Ref<string>，可读写） */
+	locale?: any;
+	/** 回退语言（Ref<string | string[] | ...>） */
+	fallbackLocale?: any;
+	/** 当前已注册的所有语言代码（只读） */
+	availableLocales?: string[];
+	/** 全部 messages（只读，结构与 createI18n 的 messages 一致） */
+	messages?: any;
+	/** 全部日期时间格式配置（只读） */
+	datetimeFormats?: any;
+	/** 全部数字格式配置（只读） */
+	numberFormats?: any;
+
+	/** 取指定语言的 messages */
+	getLocaleMessage?: (locale: string) => any;
+	/** 整包覆盖指定语言的 messages */
+	setLocaleMessage?: (locale: string, message: any) => void;
+	/** 深度合并指定语言的 messages（不会清空原有 key） */
+	mergeLocaleMessage?: (locale: string, message: any) => void;
+
+	/** 取指定语言的日期时间格式 */
+	getDateTimeFormat?: (locale: string) => any;
+	/** 整包覆盖指定语言的日期时间格式 */
+	setDateTimeFormat?: (locale: string, format: any) => void;
+	/** 深度合并指定语言的日期时间格式 */
+	mergeDateTimeFormat?: (locale: string, format: any) => void;
+
+	/** 取指定语言的数字格式 */
+	getNumberFormat?: (locale: string) => any;
+	/** 整包覆盖指定语言的数字格式 */
+	setNumberFormat?: (locale: string, format: any) => void;
+	/** 深度合并指定语言的数字格式 */
+	mergeNumberFormat?: (locale: string, format: any) => void;
+};
+
+```
+
+### 更多的语言扩展
+
+如果当前默认的语言不足以满足你，就像前置安装那样，自己把语言包补充进去就行。你也可以动态扩展语言包。
+
+### 附件：语言代码列表
+
+| 代码        | 语言名称         | 地区/脚本         | 备注说明                          |
+|-------------|------------------|-------------------|-----------------------------------|
+| zh          | 中文             | -                 | 不区分简繁和地区                   |
+| zh-CN       | 中文             | 中国（大陆）      | 简体中文                          |
+| zh-SG       | 中文             | 新加坡            | 简体中文                          |
+| zh-Hans     | 中文             | 简体              | 脚本简体，不限地区                 |
+| zh-Hant     | 中文             | 繁体              | 脚本繁体，不限地区                 |
+| zh-TW       | 中文             | 台湾              | 繁体中文                          |
+| zh-HK       | 中文             | 香港              | 繁体中文                          |
+| zh-MO       | 中文             | 澳门              | 繁体中文                          |
+| ko          | 韩语             | -                 | 不区分地区                        |
+| ko-KR       | 韩语             | 韩国              | 韩国韩语                          |
+| ko-KP       | 韩语             | 朝鲜              | 朝鲜韩语（极少用）                |
+| ja          | 日语             | -                 | 不区分地区                        |
+| ja-JP       | 日语             | 日本              | 日本日语                          |
+| en          | 英语             | -                 | 通用英语                          |
+| en-US       | 英语             | 美国              | 美国英语                          |
+| en-GB       | 英语             | 英国              | 英国英语                          |
+| en-AU       | 英语             | 澳大利亚          | 澳大利亚英语                      |
+| en-CA       | 英语             | 加拿大            | 加拿大英语                        |
+| en-IN       | 英语             | 印度              | 印度英语                          |
+| fr          | 法语             | -                 | 通用法语                          |
+| fr-FR       | 法语             | 法国              | 法国法语                          |
+| fr-CA       | 法语             | 加拿大            | 加拿大法语                        |
+| de          | 德语             | -                 | 通用德语                          |
+| de-DE       | 德语             | 德国              | 德国德语                          |
+| de-AT       | 德语             | 奥地利            | 奥地利德语                        |
+| de-CH       | 德语             | 瑞士              | 瑞士德语                          |
+| es          | 西班牙语         | -                 | 通用西班牙语                      |
+| es-ES       | 西班牙语         | 西班牙            | 西班牙西班牙语                    |
+| es-MX       | 西班牙语         | 墨西哥            | 墨西哥西班牙语                    |
+| es-AR       | 西班牙语         | 阿根廷            | 阿根廷西班牙语                    |
+| pt          | 葡萄牙语         | -                 | 通用葡萄牙语                      |
+| pt-PT       | 葡萄牙语         | 葡萄牙            | 葡萄牙葡萄牙语                    |
+| pt-BR       | 葡萄牙语         | 巴西              | 巴西葡萄牙语                      |
+| ru          | 俄语             | -                 | 通用俄语                          |
+| ru-RU       | 俄语             | 俄罗斯            | 俄罗斯俄语                        |
+| it          | 意大利语         | -                 | 通用意大利语                      |
+| it-IT       | 意大利语         | 意大利            | 意大利意大利语                    |
+| nl          | 荷兰语           | -                 | 通用荷兰语                        |
+| nl-NL       | 荷兰语           | 荷兰              | 荷兰荷兰语                        |
+| nl-BE       | 荷兰语           | 比利时            | 比利时荷兰语                      |
+| sv          | 瑞典语           | -                 | 通用瑞典语                        |
+| sv-SE       | 瑞典语           | 瑞典              | 瑞典瑞典语                        |
+| fi          | 芬兰语           | -                 | 通用芬兰语                        |
+| fi-FI       | 芬兰语           | 芬兰              | 芬兰芬兰语                        |
+| da          | 丹麦语           | -                 | 通用丹麦语                        |
+| da-DK       | 丹麦语           | 丹麦              | 丹麦丹麦语                        |
+| pl          | 波兰语           | -                 | 通用波兰语                        |
+| pl-PL       | 波兰语           | 波兰              | 波兰波兰语                        |
+| tr          | 土耳其语         | -                 | 通用土耳其语                      |
+| tr-TR       | 土耳其语         | 土耳其            | 土耳其土耳其语                    |
+| el          | 希腊语           | -                 | 通用希腊语                        |
+| el-GR       | 希腊语           | 希腊              | 希腊希腊语                        |
+| he          | 希伯来语         | -                 | 通用希伯来语                      |
+| he-IL       | 希伯来语         | 以色列            | 以色列希伯来语                    |
+| ar          | 阿拉伯语         | -                 | 通用阿拉伯语                      |
+| ar-SA       | 阿拉伯语         | 沙特阿拉伯        | 沙特阿拉伯阿拉伯语                |
+| ar-EG       | 阿拉伯语         | 埃及              | 埃及阿拉伯语                      |
+| th          | 泰语             | -                 | 通用泰语                          |
+| th-TH       | 泰语             | 泰国              | 泰国泰语                          |
+| vi          | 越南语           | -                 | 通用越南语                        |
+| vi-VN       | 越南语           | 越南              | 越南越南语                        |
+| id          | 印度尼西亚语     | -                 | 通用印尼语                        |
+| id-ID       | 印度尼西亚语     | 印度尼西亚        | 印尼印尼语                        |
+| ms          | 马来语           | -                 | 通用马来语                        |
+| ms-MY       | 马来语           | 马来西亚          | 马来西亚马来语                    |
+| hi          | 印地语           | -                 | 通用印地语                        |
+| hi-IN       | 印地语           | 印度              | 印度印地语                        |
+| ur          | 乌尔都语         | -                 | 通用乌尔都语                      |
+| ur-PK       | 乌尔都语         | 巴基斯坦          | 巴基斯坦乌尔都语                  |
+| ta          | 泰米尔语         | -                 | 通用泰米尔语                      |
+| ta-IN       | 泰米尔语         | 印度              | 印度泰米尔语                      |
+| bn          | 孟加拉语         | -                 | 通用孟加拉语                      |
+| bn-BD       | 孟加拉语         | 孟加拉国          | 孟加拉国孟加拉语                  |
+| bn-IN       | 孟加拉语         | 印度              | 印度孟加拉语                      |

package/data/tmui4x/01./346/225/231/347/250/213/37./345/276/256/344/277/241/345/210/206/344/272/253.md

@@ -0,0 +1,91 @@
+---
+outline: deep
+---
+
+# 微信分享
+
+下面介绍如何在uniappx中进行微信分享功能，分享选项式和组合式两种。
+以下分享方式，同样适合tmui3.2的分享。
+
+
+### 选项式
+
+```vue
+
+export default {
+	onShareAppMessage() {
+	    return {}
+	},
+	onShareTimeline() {
+	    return {}
+	}
+}
+```
+
+### 组合式
+
+```vue
+
+// #ifdef MP
+import { onShareAppMessage,onShareTimeline,onReady } from '@dcloudio/uni-app';
+// #endif
+
+// 必须在onReady中配置分享
+onReady(()=>{
+	// #ifdef MP
+	onShareAppMessage(()=>{
+		// 返还配置
+		return {}
+	})
+	onShareTimeline(()=>{
+		// 返还配置
+		return {}
+	})
+	// #endif
+})
+
+```
+
+### 通过VUE插件混淆
+所有页面全局打开分享
+
+####  uniapp-x
+
+```vue
+
+export default definePlugin({
+	install(app:VueApp) {
+		app.mixin({
+			onShareAppMessage() {
+			    return {}
+			},
+			onShareTimeline() {
+			    return {}
+			}
+		})
+	}
+})
+
+
+```
+
+#### uniapp混淆
+
+```vue
+
+export default {
+    // @ts-ignore
+    install: (app: App) => {
+        app.mixin({
+           onShareAppMessage() {
+               return {}
+           },
+           onShareTimeline() {
+               return {}
+           }
+        })
+    }
+};
+
+```
+

package/data/tmui4x/01./346/225/231/347/250/213/38./345/233/276/346/240/207/345/272/223.md

@@ -0,0 +1,9 @@
+---
+outline: deep
+---
+
+# 图标库
+
+图标是采用的开源[图标库remixicon](https://remixicon.com/),可免费商用，无版权限制。
+
+<ViewIcon />

package/data/tmui4x/01./346/225/231/347/250/213/39.CSS/345/272/223.md

@@ -0,0 +1,256 @@
+---
+outline: deep
+---
+
+# CSS类
+
+::: warning 提醒
+本css库不是必选文件，如果你在app.uvue安装的时候没有引入，不需要查看本教程。
+
+如果你有自己的原子css库插件，你可以不引用本css库，可以删除不影响组件
+:::
+
+## 前置说明
+
+你必须在app.uvue中已经引入！！！
+
+在可以写class的组件上即可填写，本质上这是一个css类库，为了方便大家提高布局效率而开发出来。可以兼容全部平台，而无需担心在原生上报错，已经作了兼容。
+
+**建议布局尽量使用本css库类，95%可以满足你的日常布局，让你无需写一行样式表就可以完成一个全平台的应用软件**
+
+**如果发现了纰漏请及时通知我。**
+
+
+
+
+## 杂类
+| 类名 | 作用说明 |
+| :----- | :----------- |
+| overflow | 溢出隐藏。 |
+| overflow-x | 横轴溢出隐藏，Y轴自动（滚动条） |
+| overflow-y | 竖向溢出隐藏，X轴自动（滚动条） |
+| relative | 相对定位 |
+| absolute | 绝对定位 |
+| fixed | 固定悬浮 |
+| fulled | 宽度100% |
+| fulled-height | 高度100% |
+| d-block | 使元素变为块联即占一行  |
+| vertical-align-[x] | x=[top/middle/bottom]内联对齐方式,如：vertical-align-top顶部对齐 |
+| wrap | 断行，包括内联元素和单词，数字全部强制断行 |
+| nowrap | 不断行，使用内联元素形成一排 |
+
+
+
+
+## 文本类
+| 类名 | 作用说明 |
+| :----- | :----------- |
+| text-delete | 删除线 |
+| text-underline | 下划线 |
+| text-size-[x] | 文本大小x可能的值为：xxs,xs,s,n,g,lg,xl，例如中号:text-size-n  |
+| text-weight-[x] | 粗细，x可能值为：细s,正常n,加粗b |
+| text-align-[x] | 文本对齐 。text-align-left,right,center |
+| text-overflow | 超过一行末尾省略号 |
+| text-overflow-[x] | x=[1-5],最多几行出现省略号 |
+
+
+
+## 圆角
+| 类名 | 作用说明 |
+| :----- | :----------- |
+| round-[x] | 圆角,x=[0-25],比如：round-10 |
+
+圆角的其它辅助特性。**round-tl-[上面的数值] 如：round-tl-10**
+| tl | tr | bl | br | a | t | b | l | r |
+| :--: | :--: | :--: | :--: | :--: | :--: | :--: | :--: | :--: |
+| 顶左 | 顶右 | 底左 | 底右 | 全部 | 顶左和顶右 | 底左和底右 | 顶左和底左 | 顶右和底右 |
+
+
+## 透明度
+| 类名 | 作用说明 |
+| :----- | :----------- |
+| opacity-[x] | 透明,x=只能是整数0,1,2,3,4,5,6,7,8,9对应0.0~0.9 |
+
+
+
+## zIndex层级
+
+| 类名 | 作用说明 |
+| :----- | :----------- |
+| zIndex-[x] | x=[0-25]如：zIndex-5,=>z-index:5 |
+| zIndex-n[x] | x=[0-25],其中n=4,如：zIndex-n5,=>z-index:20 |
+
+
+
+## Flex综合排版
+
+| flex-start | flex-end | flex-center | flex-between | flex-around | flex-reverse |
+| :--- | :--- | :--- | :--- | :--- | :--- |
+| 居中左对齐 | 居中右对齐 | 居中对齐 | 居中两边对齐 | 居中均分 | 行内反转内容 |
+
+| flex-row | flex-col | flex | flex-wrap | flex-shrink  |
+| :--- | :--- | :--- | :--- | :--- |
+| 横向排列 | 纵向行排列 | flex布局 | 自动断行 | 保证宽度不受挤压 |
+
+| flex-[x] |
+| :--- |
+| [x]=0-12，flex布局 |
+
+**在flex-row排列一排时，如果内部只有一元素flex-1就是占比1即100%,占比2就是20%依此类推**
+
+## Flex-row排版
+
+需要配合flex flex-row类，加上本类比如：
+
+其它类推组合
+
+| flex-row-top-start | flex-row-top-center | flex-row-top-end 
+| :--- | :--- | :--- |
+| 上左对齐 | 上中对齐 | 上右对齐 |
+
+| flex-row-center-start | flex-row-center-center | flex-row-center-end 
+| :--- | :--- | :--- |
+| 中左对齐 | 中对齐 | 中右对齐 |
+
+| flex-row-bottom-start | flex-row-bottom-center | flex-row-bottom-end 
+| :--- | :--- | :--- |
+| 底左对齐 | 底中对齐 | 底右对齐 |
+
+| flex-row-center-between |
+| :--- |
+| 上下居中，两边对齐。 |
+
+
+
+## Flex-col排版
+
+需要配合flex flex-col类，加上本类比如：
+
+其它类推组合
+
+| flex-col-top-start | flex-col-top-center | flex-col-top-end 
+| :--- | :--- | :--- |
+| 左上对齐 | 左中对齐 | 左右对齐 |
+
+| flex-col-center-start | flex-col-center-center | flex-col-center-end 
+| :--- | :--- | :--- |
+| 中左对齐 | 中对齐 | 中右对齐 |
+
+| flex-col-bottom-start | flex-col-bottom-center | flex-col-bottom-end 
+| :--- | :--- | :--- |
+| 底左对齐 | 底中对齐 | 底右对齐 |
+
+| flex-col-full |
+| :--- |
+| 两边拉齐，使用纵向内的元素宽100% |
+
+**在flex-col纵向排时，如果内部只有一元素flex-col-full就是宽度100%**
+
+## 基线对齐
+
+| flex-row-baseline-start | flex-row-baseline-center | flex-row-baseline-end |
+| :--- | :--- | :--- |
+| baseline项目基线（row时是顶，col时是左） | baseline项目基线（row时是中，col时是中） | baseline项目基线（row时是底，col时是右） |
+
+
+
+## 位置控制
+
+| t | l | r | b |
+| :---: | :---: | :---: | :---: |
+| 上top | 左left | 右right | 底bottom |
+
+**规则示例**
+注意:px单位的css文件n=2,rpx单位的文件n=4,注意区别 因为按设计标准100rpx  = 50px,按这个转换的
+*t-x** 表示正数，x=0-50，比如：t-24，表示顶部偏移24rpx，等于：top:24rpx;
+
+**t-nx** 表示正数*4的倍数，x=0-25,比如：t-n10，表示向上偏移40rpx，等于：top:40rpx;
+
+**t--x** 表示负数，x=0-50，比如：t--24，表示向上偏移24rpx，等于：top:-24rpx;
+
+**t--nx** 表示负数，x=0-25，比如：t--n10，表示向上偏移40rpx，等于：top:-40rpx;
+
+其它类推。
+
+
+
+## 外边距
+
+| 类名 | 方向 | 值 | 示例 |
+| :---: | :---: | :---: | :---: |
+| m | a | 0-50 | ma-10,四周边距为10upx |
+
+规则为 **m方向-值即可。** 
+
+可选的方向
+
+| a | l | r | t | b | x | y |
+| :---: | :---: | :---: | :---: | :---: | :---: | :---: |
+| 四周 | 左 | 右 | 顶 | 底 | 水平左右 | 竖向上下 |
+
+**注意:px单位的css文件n=2,rpx单位的文件n=4,注意区别 因为按设计标准100rpx  = 50px,按这个转换的**
+
+外边距如果觉得数据不够用嫌小，还可以这样使用**m方向-n值**比如外边距40可以写成：**ma-n10**，n*4倍的数据，n为1-25
+
+## 负数外边距
+
+**还可以使用负方向**
+
+<span style="color:red">规则和上方样，需要加上-号。比如向上负：mt--24,表示负24rpx，ml-n10表示向左负40rpx</span>
+
+
+
+
+
+## 内边距
+
+| 类名 | 方向 | 值 | 示例 |
+| :---: | :---: | :---: | :---: |
+| p | a | 0-50 | pa-10,四周内边距为10rpx |
+
+规则为**p方向-值即可。**
+
+可选的方向
+
+| a | l | r | t | b | x | y |
+| :---: | :---: | :---: | :---: | :---: | :---: | :---: |
+| 四周 | 左 | 右 | 顶 | 底 | 水平左右 | 竖向上下 |
+
+**注意:px单位的css文件n=2,rpx单位的文件n=4,注意区别 因为按设计标准100rpx  = 50px,按这个转换的**
+
+内边距如果觉得数据不够用嫌小，还可以这样使用**p方向-n值**比如内边距40可以写成：**pa-n10**，n*4倍的数据，n为1-25
+
+## 颜色类
+
+内置了常见的颜色及对应的状态颜色
+**状态类**
+| 类名 | 说明 |
+| :--: | :--: |
+| text-primary | 主色<span style="background:#0088ff;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-success | 成功<span style="background:#34c759;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-danger | 危险<span style="background:#ff8d28;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-warn | 警告<span style="background:#F3BF12;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-error | 错误<span style="background:#ff383c;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-info | 信息<span style="background:#f2f2f7;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+
+**其它具名颜色**
+| 类名 | 说明 |
+| :--: | :--: |
+| text-red | red<span style="background:#f44336;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-pink | pink<span style="background:#e91e63;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-purple | purple<span style="background:#9c27b0;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-deep-purple | deep-purple<span style="background:#673ab7;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-indigo | indigo<span style="background:#3f51b5;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-blue | blue<span style="background:#2196f3;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-light-blue | light-blue<span style="background:#03a9f4;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-cyan | cyan<span style="background:#00bcd4;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-teal | teal<span style="background:#009688;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-green | green<span style="background:#4caf50;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-light-green | light-green<span style="background:#8bc34a;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-lime | lime<span style="background:#cddc39;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-yellow | yellow<span style="background:#ffeb3b;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-amber | amber<span style="background:#ffc107;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-orange | orange<span style="background:#ff9800;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-deep-orange | deep-orange<span style="background:#ff5722;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-brown | brown<span style="background:#795548;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |
+| text-blue-grey | blue-grey<span style="background:#607d8b;display:inline-block;width:8px;height:8px;border-radius:8px;"></span> |

package/data/tmui4x/01./346/225/231/347/250/213/50.TMUI4x/350/222/270/346/261/275/350/256/241/345/210/222.md

@@ -0,0 +1,46 @@
+---
+outline: deep
+---
+
+# TMUI4x蒸汽计划
+
+在等待官方停滞更新非蒸汽UNIAPPX近半年后。官方终于发布了SDK 5.23版本，将安卓纳入了正式蒸汽适配节点。
+
+官方宣传：蒸汽模式的渲染引擎是自有C引擎渲染排版布局。逻辑层由UTS原生还是回到了JS层面。
+
+## 原生X项目与蒸汽对比
+
+| 项目 | 非蒸汽 | 蒸汽 | 说明 |
+| --- | --- | --- | --- |
+| 渲染层 | 安卓和鸿蒙纯原生，IOS类似NVUE | 自有C渲染引擎，类似FL，RN | - |
+| 代码层 | UTS，安卓编译至KT，IOS->JS,鸿蒙->JS | JS | 蒸汽后可以全部JS/TS/UTS写 |
+| 严格语法 | UTS安卓严格，鸿蒙和IOS非严格 | 非严格且可随意 | - |
+| 性能 | 一般，但安卓无延迟高效 | 所渲染层与代码层分离 | 理论上蒸汽是JS通信渲染层有通信折损，非蒸汽纯原生高效跟手，如何看待就看各位看官感受了 |
+| 插件生态 | 无法使用NPM生态 | 可以使用（有限） | 蒸汽已经是JS了理论上所有NPM生态可用，但自己也考虑兼容，因为它也是有个V8层的 |
+| UTS插件 | 编译自各原生 | 编译自各原生 | 无区别，但非蒸汽没有通信折扣，蒸汽就是类似UNIAPP的JS调用原生API |
+| 平台兼容 | 5端 | 6端(未来有支付宝小程序) | 总体区别不大 |
+
+## TMUI4x的2.0有哪些更新
+
+1. UI组件全部为样式隔离，及Setup模式。
+2. 核心的依赖更改为JS方式，不再受限制
+3. 类型将大量采用联合类型解决之前的类型限制，还有泛型上的友好支持。
+4. 全局Store改为原版Pinia JS方式不再采用UTS的方式
+5. 多语言，采用原版的Vuei18n，但打了补丁支持低端安卓，原写法没有变升级不影响
+6. 导出方法不再受限了，因此原有的Class风格导出被删除，改成了按方法单个导出了，因此你们升级要改，不可以按以前的xStore.xx只能是{x,xx} form 'xx'方式了，而不是 集成在xStore下，之前是受语法限制，没有办法。
+7. 原生插件层很多你们要改，几乎都不一样的语法 了 全升级为Dcloud式的函数调用风格了。并且全部规范化，优化升级了。
+8. 推出一批纯C底层高性能的插件，比如离线Canvas渲染，这个Dcloud是没有的，可以用来处理图片，绘制，离线UI渲染来自Google Skia源自Flutter同版本核心引擎。不止这一个原生C引擎，还有其它更多C底层引擎插件，花费大量的时间C交叉编译，至三端。
+9. UI组件层尽量使用蒸汽下的最新属性和性能
+
+## 何时发布2.0？
+
+这取决于我对Dcloud的蒸汽版本SDK的评估，时机到了自然就发布了。目前来看（截止2026-8月初）还不够 成熟 ，还未达到我认为可以商用的成熟度，从会员的反馈来看基础api，列表还有问题需要修复，建议大家再等 ，以我发布为准，未发布前可使用非蒸汽VDOM版本。
+
+## 未来如何走？
+
+随着AI快速的发展，组件的层面意义被无限弱化，甚至可以说不太重要了，因此更新会越来越慢。因为ai可以搞定一切，组件的意义已经不大了。
+
+但是：解决方案变得更有意义，比如如何配置AI，如何使用ai自动化写页面，如何使用AI自动化写项目编译，这就是一整套的自动化流程。让ai真正在干活，强者恒强。
+
+因此未来：我也在变，不在是卖 组件 了，而是具身于AI底层要用到的基础插件和工具，UI层只是一个非常常规的一层了，因为不重要了。
+因此我将会编写各种SKILL和规则让ai协调写项目。欢迎大家支付一定费用支助 我 ，这也将助于你的项目高效化。