tmui-cli 2.0.6 → 5.3.2

package/data/uni-app-x-docs/css/common/at-rules.md

@@ -4,7 +4,7 @@
 
 不支持的css功能，并不影响业务开发。因为css本质是一种编写元素的样式属性的一种描述性写法。元素的所有样式设置，都可以脱离css这种写法，由API完成。
 
-- `@keyframes关键帧动画`，在App平台，可以使用API方式实现，暂不支持通过css方式实现。详见[UniElement的animate方法](../../dom/unielement.md#animate)
+- `@keyframes关键帧动画`，App平台蒸汽模式自5.31起支持。老版本可以使用API方式实现，API详见[UniElement的animate方法](../../dom/unielement.md#animate)
 
 ## 字体 @font
 
@@ -31,7 +31,13 @@ web中加载字体图标，有 `unicode直显` 和 `伪元素+content` 2种方
 
 有些字体图标网站导出代码时，默认使用`伪元素+content`方式，需要注意这个坑，改用 unicode直显。
 
-unicode直显方式的性能优于伪元素方式，但源码阅读的直观性略差。
+unicode直显方式的性能优于伪元素方式，尤其是text组件设置flatten属性拍平后性能更佳。
+缺点是源码阅读的直观性略差。
+
+还有一种解决方式是封装成组件，参考[uni-icons组件](../../component/uni-ui-x/uni-icons.md)，用type来表示，这样源码的可读性更佳。比如
+```vue
+<uni-icons type="search" />
+```
 
 注意text组件直显unicode，需要用 <code v-pre>{{'\u'}}</code> 的方式包裹。
 另外注意实体字符和unicode的区别。
@@ -64,7 +70,7 @@ app平台的内置组件和API用到了一些字体，同时共享出来给开
   <text style="font-family: uni-icon;font-size: 64px;">{{uniIcon}}</text>
 </template>
 
-<script setup lang="uts">
+<script setup>
   const uniIcon = ref<string>('\ue601')
 </script>
 ```
@@ -91,11 +97,16 @@ app平台的内置组件和API用到了一些字体，同时共享出来给开
   </div>
 </div>
 
+- 注意：
+App内置图标，在小程序和web无法使用。在这些平台需要单独引入字体图标库。\
+内置图标中，forward、back、down、circle，这4个图标已经不再推荐使用。后续会移除。
+因为这4个图标可以通过view的边框配合transform旋转实现，view方案性能更高且全平台支持。
+
 ### Tips
 - `字体路径`支持**网络**和**本地**，本地字体请注意放在项目或uni_modules的static目录下。
 - 全平台均支持ttf和otf字体格式，其他字体格式在不同平台支持度有差异，另见[css字体](../font-family.md)
 - @font-face是不可编程的，如需编程控制，另见[uni.loadFontFace](../../api/load-font-face.md)
-- @font-face下仅支持 font-family 和 src，不支持通过font-weight 、 font-style等属性控制该字体统一样式，如果需要设置字体样式，请在具体的text组件上使用class或style定义字体样式。
+- @font-face下仅支持 font-family 和 src，不支持通过font-weight、font-style等属性控制该字体统一样式，如果需要设置字体样式，请在具体的text组件上使用class或style定义字体样式。
 
 <script>
 export default {

package/data/uni-app-x-docs/css/common/function.md

@@ -120,6 +120,10 @@ web平台的 CSS环境变量规范参考[MDN Reference](https://developer.mozill
 ## calc @calc
 > uni-app x 5.31+ App平台 蒸汽模式支持calc方法
 
+<!-- CSSJSON.function-calc_values.description -->
+
+<!-- CSSJSON.function-calc_values.compatibility -->
+
 calc() 函数允许在声明 CSS 属性值时执行计算。
 
 ### 语法
@@ -140,7 +144,7 @@ calc() 函数允许在声明 CSS 属性值时执行计算。
 优先级控制：乘除法的优先级高于加减法，如果你想先算加减，必须用圆括号 () 括起来，例如 calc((100% - 20px) / 2)
 
 ### 形式化语法
-```css 
+```css
 <calc()> =
   calc( <calc-sum> )
 
@@ -157,9 +161,11 @@ calc() 函数允许在声明 CSS 属性值时执行计算。
   ( <calc-sum> )
 ```
 
+<!-- CSSJSON.function-calc_values.example -->
+
 **注意：**
 App平台相比web平台，calc有以下差异：
 - `calc`中只支持`var` 方法, 不支持 `<frequency>`, `<angle>`, `<time>`, `<color-function>`,`<resolution>`, `<flex>`
 - 支持的属性`<width>`,`<height>`,`<padding-*>`,`<maring-*>`,`<border-*>`,`<top>`,`<left>`,`<right>`,`<bottom>`,`<flex-basis>`
-- `border-*-radius`目前不支持两值，如：border-bottom-right-radius: 10px 20px; 如果使用了 `calc` 且含百分比会根据width进行计算，如：border-bottom-right-radius: calc(50%); 且宽为 40px 计算之后的样式为:border-bottom-right-radius: 20px;
-- `border-width-*` 目前不支持百分比，该属性的calc也不支持
+- `border-*-radius`目前不支持双值配置(例如：border-bottom-right-radius: 10px 20px;) 百分比计算基准：若在圆角中使用 calc() 且包含百分比，其计算基准固定为 width（宽度）。（示例：当元素宽度为 40px 时，border-bottom-right-radius: calc(50%); 将被转换为 20px）;
+- `border-width-*` 属性本身不支持百分比单位，且其对应的 calc() 计算同样不支持百分比。

package/data/uni-app-x-docs/css/common/selector.md

@@ -1,19 +1,33 @@
 # 选择器 @selector
 
-- web和小程序支持page元素选择器，以替代body元素选择器。
-- web端可以使用`html`、`body`、`:root`等选择器。由于页面的css样式隔离，且html节点并未添加data-xxx属性，`html`、`:root`写在页面style内无效，只能写在App.uvue内。
-- 深度选择器 `:deep()/::v-deep` 用法参考 [单文件 style - 深度选择器](/vue/index#scoped) 文档。
+App平台，支持的选择器比web少。这源于开发进度、性能、运行时体积、AI友好度等多方面考虑。
+
+支持过多的选择器，会引入复杂的css优先级问题，这会导致性能下降，AI也容易搞错css优先级。\
+简单的class，可能多写几行代码，但对AI来说这不算什么，反而复杂的css权重让AI难以排查问题。
+
+uni-app x 额外引入了 `page` 选择器，该选择器是小程序规范，uni-app x 中全平台均支持。
 
 <!-- CSSJSON.selector_values.compatibility -->
 
-::: warning 注意
-1. 选择器声明的变化可能会导致元素重新绘制。为了减少选择器变化引起的 DOM 更新数量，**当前只支持：CSS 声明的多个选择器中最后一个规则的变更对 DOM 的更新**。
-2. :active伪类来实现点击态，很容易触发，并且滚动或滑动时点击态不会消失，体验较差。小程序平台均给view组件引入了`hover-class`，考虑到跨端兼容和体验，建议使用 `hover-class` 属性来实现点击态效果。[详见](../../component/view.md#hover-class)
-3. 不推荐使用伪元素来创建不占宽度的边框，W3C标准推荐使用 box-sizing 来控制边框是否占宽度。
-4. 关系类选择器（分组选择器、直接子代选择器、后代选择器、一般兄弟选择器、紧邻兄弟选择），无法在编译期处理，必须运行时动态计算，在App上有额外的性能损耗。推荐尽量使用简单的选择器来解决问题。
-:::
+## App平台不支持情况的替代方案
+### 伪类
+- 通过`:active`伪类来实现点击态，很容易触发，并且滚动或滑动时点击态不会消失。小程序平台均给view组件引入了`hover-class`，考虑到跨端兼容和体验，需使用 `hover-class` 属性来实现点击态效果。[详见](../../component/view.md#hover-class)
+- :first-child / :last-child / :nth-child()，需改用动态class方式，示例代码[详见](https://gitcode.com/dcloud/hello-uni-app-x/blob/alpha/pages/CSS/border/dynamic-border.uvue)
+
+### 伪元素
+- 字体图标，无法使用`::before`、`::after`等伪元素，而需使用unicode直显方案。[详见](./at-rules.md#iconfont)
+- 不推荐使用伪元素来创建不占宽度的边框，W3C标准推荐使用 box-sizing 来控制边框是否占宽度。
+- `::placeholder`：在input和textarea组件中，替代方案是[placeholder-class](../../component/input.md)。
+- `::selection`：在input和textarea组件中，小程序和App平台可通过cursor-color影响选区颜色；在rich-text组件中，App平台支持selection-handle-color、selection-background-color属性来设置选区样式。
+- `::part`：小程序和App平台不支持web component。仅支持vue组件，可使用[externalClass](./style-isolation.md#external-class)来设置组件中子组件的样式。
 
-## 示例
+### 关系选择器
+关系类选择器（分组选择器、直接子代选择器、后代选择器、一般兄弟选择器、紧邻兄弟选择），在App平台VDOM模式曾被支持，蒸汽模式暂不支持。
+
+## App平台是后设生效
+选择器声明的变化可能会导致元素重新绘制。为了减少选择器变化引起的 DOM 更新数量，**当前只支持：CSS 声明的多个选择器中最后一个规则的变更对 DOM 的更新**。
+
+示例
 
 ```vue
 <template>
@@ -34,7 +48,7 @@
   }
 </style>
 
-<script setup lang="uts">
+<script setup>
   const rowDesc = ref('row-desc1')
   const docBody = ref('doc-body1')
 </script>
@@ -45,6 +59,6 @@
 
 <!-- EXAMPLEJSON.css.selector -->
 
-::: warning 注意
-App端相邻选择器暂不支持动态新增或删减节点，为了优化性能减少一些重新渲染工作，示例 [https://issues.dcloud.net.cn/pages/issues/detail?id=1452](https://issues.dcloud.net.cn/pages/issues/detail?id=1452)
-:::
+## tips
+- web端可以使用`html`、`body`、`:root`等选择器。由于页面的css样式隔离，且html节点并未添加data-xxx属性，`html`、`:root`写在页面style内无效，只能写在App.uvue内。
+- 深度选择器 `:deep()/::v-deep` 用法参考 [单文件 style - 深度选择器](../../vue/README.md#scoped) 文档。

package/data/uni-app-x-docs/css/common/style-isolation.md

@@ -92,7 +92,7 @@ VDOM 模式，考虑到向下兼容问题，目前没有废弃老版样式隔离
 使用示例：
 - 组合式示例
 ```vue
-<script setup lang="uts">
+<script setup>
 	defineOptions({
 		styleIsolation: 'isolated' //表示隔离，不受外部影响
 	})
@@ -159,7 +159,7 @@ Switch组件示例源码：
     <view class="uni-switch-thumb" :class="thumbClass"></view> <!-- 这里是圆球view -->
   </view>
 </template>
-<script lang="uts" setup>
+<script lang="ts" setup>
 const props = withDefaults(defineProps<SwitchProps>(), {
   thumbClass: '' // 定义一个thumbClass属性
 })
@@ -240,7 +240,7 @@ external-style是内联字符串，不受样式隔离策略影响，它永远生
     <view :style="thumbStyle" class="uni-switch-thumb" :class="thumbClass"></view> <!-- 这里是圆球view -->
   </view>
 </template>
-<script lang="uts" setup>
+<script lang="ts" setup>
 const props = withDefaults(defineProps<SwitchProps>(), {
   thumbClass: '' // 定义一个thumbClass属性
   thumbStyle: '' // 定义一个thumbStyle属性

package/data/uni-app-x-docs/css/position.md

@@ -35,15 +35,11 @@ position: fixed定位时，web端为相对于整个浏览器页面进行定位
   height: 100px;
   background-color: #FF0000;
   left: 10px;
-  /* #ifdef WEB */
   /*
-   * HBuilderX 4.52之前只能使用--window-top，不可使用--uni-safe-area-inset-top
+   * HBuilder 4.52之前只能使用--window-top，不可使用--uni-safe-area-inset-top
+	 * App平台需5.31+蒸汽模式才能使用calc
    */
   top: calc(--uni-safe-area-inset-top + 10px); 
-  /* #endif */
-  /* #ifdef APP */
-  top: 10px;  /* App端暂不支持calc */
-  /* #endif */
 }
 ```
 

package/data/uni-app-x-docs/css/visibility.md

@@ -12,6 +12,14 @@
 **注意**
 设置 visibility 为 hidden，或设置 display 为 none 都可以隐藏元素。差异是通过 visibility 隐藏元素仍然占据页面位置，通过 display 隐藏元素不占据页面位置。
 
+#### App平台差异
+App平台设置如果元素的 visibility 设置为 hidden，其子元素将不可见，即使子元素的 visibility 设置为 visible 也不可见。
+
+**蒸汽模式拍平(flatten)**  
+- app-android平台visibility支持拍平。view组件visibility设置为hidden时拍平存在缺陷，view的子元素默认仍然会显示，子元素的显示状态由其自身的visibility决定
+- app-ios平台visibility支持拍平。view组件visibility设置为hidden时拍平存在缺陷，view的非拍平子元素默认仍然会显示，非拍平子元素的显示状态由其自身的visibility决定，而拍平子元素会跟随此view不可见
+- app-harmony平台visibility暂不支持拍平
+
 <!-- CSSJSON.visibility.defaultValue -->
 
 <!-- CSSJSON.visibility.unixTags -->
@@ -20,7 +28,4 @@
 
 <!-- CSSJSON.visibility.example -->
 
-#### App平台差异
-App平台设置如果元素的 visibility 设置为 hidden，其子元素将不可见，即使子元素的 visibility 设置为 visible 也不可见。
-
 <!-- CSSJSON.visibility.reference -->

package/data/uni-app-x-docs/css/word-break.md

@@ -0,0 +1,18 @@
+## word-break
+
+
+<!-- CSSJSON.word-break.description -->
+
+<!-- CSSJSON.word-break.compatibility -->
+
+<!-- CSSJSON.word-break.syntax -->
+
+<!-- CSSJSON.word-break.values -->
+
+<!-- CSSJSON.word-break.defaultValue -->
+
+<!-- CSSJSON.word-break.unixTags -->
+
+<!-- CSSJSON.word-break.example -->
+
+<!-- CSSJSON.word-break.reference -->

package/data/uni-app-x-docs/i18n.md

@@ -25,8 +25,8 @@ APP 蒸汽模式、鸿蒙和 iOS VDOM 模式、Web平台、小程序平台可以
 │   ├── en.json
 │   ├── zh-Hans.json
 │   └── zh-Hant.json
-├── i18n.uts
-└── main.uts
+├── i18n.ts
+└── main.ts
 ```
 
 语言文件内容示例：
@@ -44,7 +44,7 @@ APP 蒸汽模式、鸿蒙和 iOS VDOM 模式、Web平台、小程序平台可以
 }
 ```
 
-在 `i18n.uts` 中初始化 `vue-i18n`：
+在 `i18n.ts` 中初始化 `vue-i18n`：
 
 ```ts
 import { createI18n } from 'vue-i18n'
@@ -64,12 +64,12 @@ export const i18n = createI18n({
 })
 ```
 
-在 `main.uts` 中挂载 `i18n`：
+在 `main.ts` 中挂载 `i18n`：
 
 ```ts
 import App from './App.uvue'
 import { createSSRApp } from 'vue'
-import { i18n } from './i18n.uts'
+import { i18n } from './i18n.ts'
 
 export function createApp() {
   const app = createSSRApp(App)
@@ -89,7 +89,7 @@ export function createApp() {
     <text>{{ t('i18n.description') }}</text>
     <text>{{ t('i18n.currentLocale') }}: {{ locale }}</text>
     <text>{{ t('i18n.greeting') }}</text>
-    <text>{{ t('i18n.named', { framework: 'uni-app x' } as UTSJSONObject) }}</text>
+    <text>{{ t('i18n.named', { framework: 'uni-app x' }) }}</text>
 
     <button @click="changeLocale('zh-Hans')">{{ t('i18n.switchToZhHans') }}</button>
     <button @click="changeLocale('zh-Hant')">{{ t('i18n.switchToZhHant') }}</button>
@@ -97,7 +97,7 @@ export function createApp() {
   </view>
 </template>
 
-<script setup lang="uts">
+<script setup lang="ts">
 import { useI18n } from 'vue-i18n'
 
 const { t, locale } = useI18n()
@@ -114,7 +114,7 @@ const changeLocale = (newLocale : string) => {
 
 ## pages.json 国际化@pages
 
-> App平台 pages.json 不支持通过配置语言json文件实现国际化，暂时可通过tabbar和navigationbar的API来设置文字  
+> App平台 pages.json 不支持通过配置语言json文件实现国际化，暂时可通过tabbar和navigationbar的API来设置文字
 
 Web平台还额外支持如下使用方式：
 
@@ -194,14 +194,14 @@ uni-app x 的部分组件和API涉及界面，框架内置支持的国际化语
 		* `拍摄` 打开的是系统相机界面，在app平台跟随系统语言，不受uni-app x内置国际化语言列表限制
 		* `从相册选择` 分系统相册和自定义相册。系统相册的国际化是根据手机OS的语言设置。自定义相册界面，在uni-app x内置国际化语言列表可配置。
 	+ 小程序这部分的国际化大多跟随小程序宿主的语言
-- [uni.chooseMedia](./api/choose-media.md)：  
-  + app平台弹出系统媒体选择界面，使用的是当前系统的语言。  
+- [uni.chooseMedia](./api/choose-media.md)：
+  + app平台弹出系统媒体选择界面，使用的是当前系统的语言。
 
 
-## manifest.json 国际化@manifest  
-> HBuilderX5.0及以上版本 app-android/app-ios 平台云端打包和 app-harmony 平台本地打包支持设置国际化  
+## manifest.json 国际化@manifest
+> HBuilderX5.0及以上版本 app-android/app-ios 平台云端打包和 app-harmony 平台本地打包支持设置国际化
 
-manifest.json 文件的国际化与 pages.json 一样，在项目根目录的locale目录下配置语言json文件，locale/[语言标签](#lantag).json，如下：  
+manifest.json 文件的国际化与 pages.json 一样，在项目根目录的locale目录下配置语言json文件，locale/[语言标签](#lantag).json，如下：
 
 ```
 ├── locale
@@ -210,7 +210,7 @@ manifest.json 文件的国际化与 pages.json 一样，在项目根目录的loc
 │   └── zh-Hant.json
 ```
 
-语言文件示例（zh-Hans.json）：  
+语言文件示例（zh-Hans.json）：
 
 ```json
 {
@@ -218,10 +218,10 @@ manifest.json 文件的国际化与 pages.json 一样，在项目根目录的loc
 }
 ```
 
-### 应用名称  
-在manifest.json可视化界面的“应用名称”中配置为 `%app.name%` 。  
+### 应用名称
+在manifest.json可视化界面的“应用名称”中配置为 `%app.name%` 。
 
-或在 源码视图 中配置如下：  
+或在 源码视图 中配置如下：
 ```json
 {
   "name": "%app.name%",
@@ -229,17 +229,17 @@ manifest.json 文件的国际化与 pages.json 一样，在项目根目录的loc
 }
 ```
 
-配置后需提交云端打包生效。  
+配置后需提交云端打包生效。
 
-**注意**  
-app-android、app-ios平台离线打包需在原生工程中配置应用的国际化名称。  
+**注意**
+app-android、app-ios平台离线打包需在原生工程中配置应用的国际化名称。
 
 
-### app-ios平台隐私信息许可描述  
-iOS平台应用的隐私信息访问的许可描述中的提示文字，也可在manifest.json中配置国际化。  
-在可视化界面 “iOS App配置” 的 “隐私信息访问的许可描述” 对应的项中配置，如 “摄像头（NSCameraUsageDescription）” 项配置为 `%app.ios.des.camera%` 。  
+### app-ios平台隐私信息许可描述
+iOS平台应用的隐私信息访问的许可描述中的提示文字，也可在manifest.json中配置国际化。
+在可视化界面 “iOS App配置” 的 “隐私信息访问的许可描述” 对应的项中配置，如 “摄像头（NSCameraUsageDescription）” 项配置为 `%app.ios.des.camera%` 。
 
-或在 源码视图 中配置 “摄像头（NSCameraUsageDescription）” 如下：  
+或在 源码视图 中配置 “摄像头（NSCameraUsageDescription）” 如下：
 ```json
 {
   "app-ios": {
@@ -252,10 +252,10 @@ iOS平台应用的隐私信息访问的许可描述中的提示文字，也可
 }
 ```
 
-配置后需提交云端打包生效。  
+配置后需提交云端打包生效。
 
-**注意**  
-app-ios平台暂不支持配置Info.plist文件中其他信息的国际化配置，有此特殊需求离线打包可在原生XCode工程中配置。  
+**注意**
+app-ios平台暂不支持配置Info.plist文件中除应用名称和隐私许可描述外的其他字段国际化配置，有此特殊需求请使用`uni-app x 原生SDK`在原生Xcode工程中配置。
 
 
 ## uniCloud国际化
@@ -357,16 +357,16 @@ Web平台注意要区分系统语言和应用语言的概念。
 当前应用语言发生变化时，触发回调。也就是`uni.setLocale`执行时。
 
 
-## 语言标签 @lantag  
+## 语言标签 @lantag
 
-语言标签由一个或多个子标签（subtags）组成，用连字号(-)分隔，子标签只能由基本拉丁字母或数字组成。处理逻辑遵循 BCP 47 规范。  
+语言标签由一个或多个子标签（subtags）组成，用连字号(-)分隔，子标签只能由基本拉丁字母或数字组成。处理逻辑遵循 BCP 47 规范。
 
 语言标签通常为两个或三个字母，参考[ISO 639](https://zh.wikipedia.org/wiki/ISO_639-1%E4%BB%A3%E7%A0%81%E8%A1%A8)规范
 
 语言代码-地区代码，地区代码为两个字母，参考[ISO 3166-2](https://zh.wikipedia.org/wiki/ISO_3166-2)规范
 
 
-常见语言标签示例：  
+常见语言标签示例：
 | 标签        | 含义            | 使用场景                |
 | -           | -               | -                      |
 | zh          | 中文（泛指）    | 通用中文内容            |