From 3046168642ce593384f597773d9a753db031edd2 Mon Sep 17 00:00:00 2001 From: tianyu Date: Wed, 21 Sep 2022 10:03:33 +0800 Subject: [PATCH] update ts-framework-directory Signed-off-by: tianyu --- zh-cn/application-dev/ui/Readme-CN.md | 3 +- .../ui/ts-framework-directory.md | 13 ++- .../application-dev/ui/ts-framework-js-tag.md | 101 ------------------ 3 files changed, 12 insertions(+), 105 deletions(-) delete mode 100644 zh-cn/application-dev/ui/ts-framework-js-tag.md diff --git a/zh-cn/application-dev/ui/Readme-CN.md b/zh-cn/application-dev/ui/Readme-CN.md index 7bc13823db..de85a882c0 100755 --- a/zh-cn/application-dev/ui/Readme-CN.md +++ b/zh-cn/application-dev/ui/Readme-CN.md @@ -7,7 +7,6 @@ - 文件组织 - [目录结构](ts-framework-directory.md) - [应用代码文件访问规则](ts-framework-file-access-rules.md) - - [js标签配置](ts-framework-js-tag.md) - 资源管理 - [资源文件的分类](ui-ts-basic-resource-file-categories.md) - [资源访问](ts-resource-access.md) @@ -72,7 +71,7 @@ - [构建食物分类Grid布局](ui-ts-building-category-grid-layout.md) - [页面跳转与数据传递](ui-ts-page-redirection-data-transmission.md) - [性能提升的推荐方法](ts-performance-improvement-recommendation.md) - + - UI开发（兼容JS的类Web开发范式） - [概述](ui-js-overview.md) - 框架说明 diff --git a/zh-cn/application-dev/ui/ts-framework-directory.md b/zh-cn/application-dev/ui/ts-framework-directory.md index b4a7b831db..7876c54f3d 100644 --- a/zh-cn/application-dev/ui/ts-framework-directory.md +++ b/zh-cn/application-dev/ui/ts-framework-directory.md @@ -13,7 +13,6 @@ FA应用的eTS模块(entry/src/main)的典型开发目录结构如下： .ets结尾的eTS（extended TypeScript）文件，用于描述UI布局、样式、事件交互和页面逻辑。 - **各个文件夹和文件的作用：** @@ -27,5 +26,15 @@ FA应用的eTS模块(entry/src/main)的典型开发目录结构如下： > **说明：** > > - 资源目录resources文件夹位于src/main下，此目录下资源文件的详细规范以及子目录结构规范参看[资源文件的分类](ui-ts-basic-resource-file-categories.md)。 +>- 页面支持导入TypeScript和JavaScript文件。 + +**js标签配置:** + + 开发框架需要在配置文件中标识相关的js标签，其中的每个元素代表一个JS模块的信息，包含了实例名称、页面路由、视图窗口等。 + + +> **说明：** +> +> FA模型请参考 [表22 js对象的内部结构说明](../quick-start/package-structure.md#module对象的内部结构)。 > -> - 页面支持导入TypeScript和JavaScript文件。 +> Stage模型请参考 [表3 module对象内部结构说明](../quick-start/stage-structure.md#module对象内部结构)。 diff --git a/zh-cn/application-dev/ui/ts-framework-js-tag.md b/zh-cn/application-dev/ui/ts-framework-js-tag.md deleted file mode 100644 index fd31748b84..0000000000 --- a/zh-cn/application-dev/ui/ts-framework-js-tag.md +++ /dev/null @@ -1,101 +0,0 @@ -# js标签配置 - -开发框架需要应用的config.json中配置相关的js标签，其中包含了实例名称、页面路由、视图窗口配置信息。 - - -| 标签 | 类型 | 默认值 | 必填 | 描述 | -| ------ | ------ | ------- | ---- | ---------------------------------------- | -| name | string | default | 是 | 标识ETS实例的名字。 | -| pages | Array | - | 是 | 页面路由信息，详见[pages](#pages)说明。 | -| window | Object | - | 否 | 视图窗口配置信息，详见[window](#window)说明。 | -| mode | Object | - | 否 | 配置Js Component运行类型与语法风格，详见[mode](#mode)说明。 | - - -## pages - -定义每个页面入口组件的路由信息，每个页面由页面路径和页面名组成，页面的文件名就是页面名。比如： - -```json -{ - "pages": [ - "pages/index", - "pages/detail" - ] -} -``` - -> **说明：** -> - pages列表中第一个页面为应用的首页入口。 -> -> - 页面文件名不能使用组件名称，比如：Text.ets、Button.ets等。 -> -> - 每个页面文件中必须包含[页面入口组件](../ui/ts-component-based-entry.md)(\@Entry装饰)。 - - -## window - -window用于配置相关视图显示窗口，支持配置如下属性： - -| 类型 | 默认值 | 说明 | -| ----------- | ---- | ---------------------------------------- | -| designWidth | - | 配置视图显示的逻辑宽度，缺省默认720（智能穿戴默认454）。视图显示的逻辑宽度决定了lpx像素单位大小，如designWidth配置720时，在视图宽度为1440物理像素时，1lpx为2物理像素。详见[lpx像素单位](../ui/ts-pixel-units.md)说明。 | - -```json -{ - ... - "window": { - "designWidth": 720 - } - ... -} -``` - - -## mode - -mode用于配置JS Component的运行类型与语法风格，支持如下属性： - -| 类型 | 默认值 | 说明 | -| ------ | ---- | ---------------------------------------- | -| type | - | 配置该JS Component的运行类型，可选值为：
- pageAbility：以ability的方式运行该JS Component。
- form：以卡片的方式运行该JS Component。 | -| syntax | - | 配置该JS Component的语法风格，可选值为：
- hml：以hml/css/js风格进行编写。
- ets：以声明式语法风格进行编写。 | - -> **说明：** -> 不支持同时配置type类型为form，syntax类型为ets。 - - -## 示例 - -config.json: - -```json -{ - "app": { - "bundleName": "com.example.player", - "version": { - "code": 1, - "name": "1.0" - }, - "vendor": "example" - }, - "module": { - "js": [{ - "name": "default", - "pages": [ - "pages/index", - "pages/detail" - ], - "window": { - "designWidth": 720 - }, - "mode": { - "type": "pageAbility", - "syntax": "ets" - }, - }], - "abilities": [{ - ... - }] - } -} -``` -- GitLab