开源鸿蒙 “js” Tag

2022-08-09 浏览 (672)

"js" Tag

Configure the "js" tag in the config.json file of your application. The "js" tag contains the instance name, page route, and window configuration information.

TagTypeDefault ValueMandatoryDescription
namestringdefaultYesName of the eTS instance.
pagesArray-YesPage route information. For details, see "pages".
windowObject-NoWindow configuration information. For details, see "window".
modeObject-NoRunning type and syntax style of the JS component. For details, see "mode".

pages

The "pages" defines the route information of each page's entry component. Each page consists of the page path and page name. The following is an example:

{
    "pages": [
        "pages/index",
        "pages/detail"
    ]
}

icon-note.gif NOTE:

  • The first page in the "pages" list is the home page of the application.

  • The page name must not be a component name, for example, Text.ets or Button.ets.

  • Each page file must contain the page entry component (with the @Entry decoration).

window

The "window" configures the view window. The following attributes can be configured:

TypeDefault ValueDescription
designWidth-Logical width of the view. The default value is 720. (The default value is 454 for wearables.) The logical width of the view determines the unit size of lpx. For example, if designWidth is 720 and the view width is 1440 physical pixels, 1 lpx is 2 physical pixels. For details, see lpx.
{
  ...
  "window": {
    "designWidth": 720
  }
  ...
}

mode

The "mode" configures the running type and syntax style of a JS component. The following attributes are supported:

TypeDefault ValueDescription
type-Running type of the JS component. The options are as follows:
- pageAbility: Run the JS component in ability mode.
- form: Run the JS component as a service widget.
syntax-Syntax type of the JS component. The options are as follows:
- hml: compiled in the .hml, .css, or .js style.
- ets: compiled in the declarative syntax style.

icon-note.gif NOTE: If type is set to form, syntax cannot be ets.

Example

config.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": [{
            ... 
        }]
    }
}

你可能感兴趣的文章

开源鸿蒙 UI Development

开源鸿蒙 ArkUI Overview

开源鸿蒙 File Organization

开源鸿蒙 app.js

开源鸿蒙 “js” Tag

开源鸿蒙 Lifecycle

开源鸿蒙 Multi-Language Capability

开源鸿蒙 Resource Limitations and Access

开源鸿蒙 CSS

开源鸿蒙 HML

  • 所属分类: 后端技术
  • 本文标签: 鸿蒙 软件
  • 版权声明: 本文链接 https://seaxiang.com/blog/3d68d51c33074eef9c8f2d51fd1c36eb