1# js标签配置<a name="ZH-CN_TOPIC_0000001164290700"></a> 2 3js标签中包含了实例名称、页面路由和窗口样式信息。 4 5<a name="zh-cn_topic_0000001173324643_t092f7d78cacb46d583b3499e7cf3e7f2"></a> 6<table><thead align="left"><tr id="zh-cn_topic_0000001173324643_r8ff2bb3ff6c84115be187bad81bb8dce"><th class="cellrowborder" valign="top" width="21.89%" id="mcps1.1.6.1.1"><p id="zh-cn_topic_0000001173324643_a16a1bbba39d7414b8e77ae9bcf230b7b"><a name="zh-cn_topic_0000001173324643_a16a1bbba39d7414b8e77ae9bcf230b7b"></a><a name="zh-cn_topic_0000001173324643_a16a1bbba39d7414b8e77ae9bcf230b7b"></a>标签</p> 7</th> 8<th class="cellrowborder" valign="top" width="13.969999999999999%" id="mcps1.1.6.1.2"><p id="zh-cn_topic_0000001173324643_a1fdbf4e9a38840029b6eb94a7f89b29a"><a name="zh-cn_topic_0000001173324643_a1fdbf4e9a38840029b6eb94a7f89b29a"></a><a name="zh-cn_topic_0000001173324643_a1fdbf4e9a38840029b6eb94a7f89b29a"></a>类型</p> 9</th> 10<th class="cellrowborder" valign="top" width="13.139999999999999%" id="mcps1.1.6.1.3"><p id="zh-cn_topic_0000001173324643_a07bcb8a8bbea4e8d9c60b8a4b1031970"><a name="zh-cn_topic_0000001173324643_a07bcb8a8bbea4e8d9c60b8a4b1031970"></a><a name="zh-cn_topic_0000001173324643_a07bcb8a8bbea4e8d9c60b8a4b1031970"></a>默认值</p> 11</th> 12<th class="cellrowborder" valign="top" width="9%" id="mcps1.1.6.1.4"><p id="zh-cn_topic_0000001173324643_a39b2ea2535e04e37a418e8374f3271e4"><a name="zh-cn_topic_0000001173324643_a39b2ea2535e04e37a418e8374f3271e4"></a><a name="zh-cn_topic_0000001173324643_a39b2ea2535e04e37a418e8374f3271e4"></a>必填</p> 13</th> 14<th class="cellrowborder" valign="top" width="42%" id="mcps1.1.6.1.5"><p id="zh-cn_topic_0000001173324643_ae9e9127cfa374d18a3741f4247791acf"><a name="zh-cn_topic_0000001173324643_ae9e9127cfa374d18a3741f4247791acf"></a><a name="zh-cn_topic_0000001173324643_ae9e9127cfa374d18a3741f4247791acf"></a>描述</p> 15</th> 16</tr> 17</thead> 18<tbody><tr id="zh-cn_topic_0000001173324643_row19493102613510"><td class="cellrowborder" valign="top" width="21.89%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173324643_p6494172618357"><a name="zh-cn_topic_0000001173324643_p6494172618357"></a><a name="zh-cn_topic_0000001173324643_p6494172618357"></a>name</p> 19</td> 20<td class="cellrowborder" valign="top" width="13.969999999999999%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173324643_p1449472643513"><a name="zh-cn_topic_0000001173324643_p1449472643513"></a><a name="zh-cn_topic_0000001173324643_p1449472643513"></a>string</p> 21</td> 22<td class="cellrowborder" valign="top" width="13.139999999999999%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173324643_p1749412619355"><a name="zh-cn_topic_0000001173324643_p1749412619355"></a><a name="zh-cn_topic_0000001173324643_p1749412619355"></a>default</p> 23</td> 24<td class="cellrowborder" valign="top" width="9%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173324643_p64947262359"><a name="zh-cn_topic_0000001173324643_p64947262359"></a><a name="zh-cn_topic_0000001173324643_p64947262359"></a>是</p> 25</td> 26<td class="cellrowborder" valign="top" width="42%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173324643_p8494122612352"><a name="zh-cn_topic_0000001173324643_p8494122612352"></a><a name="zh-cn_topic_0000001173324643_p8494122612352"></a>标识JS实例的名字。</p> 27</td> 28</tr> 29<tr id="zh-cn_topic_0000001173324643_r3d05cd5e24f14308a71d21d2d01adb81"><td class="cellrowborder" valign="top" width="21.89%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173324643_a5a33cd31feb7416ab1ee44a6b863e57d"><a name="zh-cn_topic_0000001173324643_a5a33cd31feb7416ab1ee44a6b863e57d"></a><a name="zh-cn_topic_0000001173324643_a5a33cd31feb7416ab1ee44a6b863e57d"></a>pages</p> 30</td> 31<td class="cellrowborder" valign="top" width="13.969999999999999%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173324643_a90233739ef8a4977ba0a9a48282d324d"><a name="zh-cn_topic_0000001173324643_a90233739ef8a4977ba0a9a48282d324d"></a><a name="zh-cn_topic_0000001173324643_a90233739ef8a4977ba0a9a48282d324d"></a>Array</p> 32</td> 33<td class="cellrowborder" valign="top" width="13.139999999999999%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173324643_aaa1317b02aef4aee98e42227902ac7e5"><a name="zh-cn_topic_0000001173324643_aaa1317b02aef4aee98e42227902ac7e5"></a><a name="zh-cn_topic_0000001173324643_aaa1317b02aef4aee98e42227902ac7e5"></a>-</p> 34</td> 35<td class="cellrowborder" valign="top" width="9%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173324643_a225959a4c42f44f4ad25fac5f48f34f5"><a name="zh-cn_topic_0000001173324643_a225959a4c42f44f4ad25fac5f48f34f5"></a><a name="zh-cn_topic_0000001173324643_a225959a4c42f44f4ad25fac5f48f34f5"></a>是</p> 36</td> 37<td class="cellrowborder" valign="top" width="42%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173324643_a5f03a4f4a1fd461b9e4bc025569fcb2d"><a name="zh-cn_topic_0000001173324643_a5f03a4f4a1fd461b9e4bc025569fcb2d"></a><a name="zh-cn_topic_0000001173324643_a5f03a4f4a1fd461b9e4bc025569fcb2d"></a>路由信息,详见“<strong id="zh-cn_topic_0000001173324643_a4e250b60d2f84a32841a9b3a90941d81"><a name="zh-cn_topic_0000001173324643_a4e250b60d2f84a32841a9b3a90941d81"></a><a name="zh-cn_topic_0000001173324643_a4e250b60d2f84a32841a9b3a90941d81"></a><a href="#zh-cn_topic_0000001173324643_section3239252133513">pages</a></strong>”。</p> 38</td> 39</tr> 40<tr id="zh-cn_topic_0000001173324643_row12517192619239"><td class="cellrowborder" valign="top" width="21.89%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173324643_p18517172622317"><a name="zh-cn_topic_0000001173324643_p18517172622317"></a><a name="zh-cn_topic_0000001173324643_p18517172622317"></a>window</p> 41</td> 42<td class="cellrowborder" valign="top" width="13.969999999999999%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173324643_p15517626112313"><a name="zh-cn_topic_0000001173324643_p15517626112313"></a><a name="zh-cn_topic_0000001173324643_p15517626112313"></a>Object</p> 43</td> 44<td class="cellrowborder" valign="top" width="13.139999999999999%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173324643_p3517112615234"><a name="zh-cn_topic_0000001173324643_p3517112615234"></a><a name="zh-cn_topic_0000001173324643_p3517112615234"></a>-</p> 45</td> 46<td class="cellrowborder" valign="top" width="9%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173324643_p1451782692314"><a name="zh-cn_topic_0000001173324643_p1451782692314"></a><a name="zh-cn_topic_0000001173324643_p1451782692314"></a>否</p> 47</td> 48<td class="cellrowborder" valign="top" width="42%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173324643_p1517326152317"><a name="zh-cn_topic_0000001173324643_p1517326152317"></a><a name="zh-cn_topic_0000001173324643_p1517326152317"></a>窗口信息,详见“<strong id="zh-cn_topic_0000001173324643_b10874923141111"><a name="zh-cn_topic_0000001173324643_b10874923141111"></a><a name="zh-cn_topic_0000001173324643_b10874923141111"></a><a href="#zh-cn_topic_0000001173324643_section728811177376">window</a></strong>”。</p> 49</td> 50</tr> 51</tbody> 52</table> 53 54> **说明:** 55>name、pages和window等标签配置需在配置文件(config.json)中的“js”标签中完成设置。 56 57## pages<a name="zh-cn_topic_0000001173324643_section3239252133513"></a> 58 59定义每个页面的路由信息,每个页面由页面路径和页面名组成,页面的文件名就是页面名。比如: 60 61``` 62{ 63 ... 64 "pages": [ 65 "pages/index/index", 66 "pages/detail/detail" 67 ] 68 ... 69} 70``` 71 72> **说明:** 73>- pages列表中第一个页面是应用的首页,即entry入口。 74>- 页面文件名不能使用组件名称,比如:text.hml、button.hml等。 75 76## window<a name="zh-cn_topic_0000001173324643_section728811177376"></a> 77 78window用于定义与显示窗口相关的配置。对于屏幕适配问题,有2种配置方法: 79 80- 指定designWidth(屏幕逻辑宽度),所有与大小相关的样式(例如width、font-size)均以designWidth和实际屏幕宽度的比例进行缩放,例如在designWidth为720时,如果设置width为100px时,在实际宽度为1440物理像素的屏幕上,width实际渲染像素为200物理像素。 81- 设置autoDesignWidth为true,此时designWidth字段将会被忽略,渲染组件和布局时按屏幕密度进行缩放。屏幕逻辑宽度由设备宽度和屏幕密度自动计算得出,在不同设备上可能不同,请使用相对布局来适配多种设备。例如:在466\*466分辨率,320dpi的设备上,屏幕密度为2(以160dpi为基准),1px等于渲染出的2物理像素。 82 83 > **说明:** 84 >1. 组件样式中<length\>类型的默认值,按屏幕密度进行计算和绘制,如:在屏幕密度为2(以160dpi为基准)的设备上,默认<length\>为1px时,设备上实际渲染出2物理像素。 85 >2. autoDesignWidth、designWidth的设置不影响默认值计算方式和绘制结果。 86 87 88<a name="zh-cn_topic_0000001173324643_table4231104116370"></a> 89<table><thead align="left"><tr id="zh-cn_topic_0000001173324643_row17231541183714"><th class="cellrowborder" valign="top" width="19.558044195580443%" id="mcps1.1.6.1.1"><p id="zh-cn_topic_0000001173324643_p1723112411376"><a name="zh-cn_topic_0000001173324643_p1723112411376"></a><a name="zh-cn_topic_0000001173324643_p1723112411376"></a>属性</p> 90</th> 91<th class="cellrowborder" valign="top" width="12.218778122187782%" id="mcps1.1.6.1.2"><p id="zh-cn_topic_0000001173324643_p12313414371"><a name="zh-cn_topic_0000001173324643_p12313414371"></a><a name="zh-cn_topic_0000001173324643_p12313414371"></a>类型</p> 92</th> 93<th class="cellrowborder" valign="top" width="8.37916208379162%" id="mcps1.1.6.1.3"><p id="zh-cn_topic_0000001173324643_p1323118413374"><a name="zh-cn_topic_0000001173324643_p1323118413374"></a><a name="zh-cn_topic_0000001173324643_p1323118413374"></a>必填</p> 94</th> 95<th class="cellrowborder" valign="top" width="19.748025197480253%" id="mcps1.1.6.1.4"><p id="zh-cn_topic_0000001173324643_p2423537113218"><a name="zh-cn_topic_0000001173324643_p2423537113218"></a><a name="zh-cn_topic_0000001173324643_p2423537113218"></a>缺省值</p> 96</th> 97<th class="cellrowborder" valign="top" width="40.095990400959906%" id="mcps1.1.6.1.5"><p id="zh-cn_topic_0000001173324643_p17231124163710"><a name="zh-cn_topic_0000001173324643_p17231124163710"></a><a name="zh-cn_topic_0000001173324643_p17231124163710"></a>描述</p> 98</th> 99</tr> 100</thead> 101<tbody><tr id="zh-cn_topic_0000001173324643_row1423174133715"><td class="cellrowborder" valign="top" width="19.558044195580443%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173324643_p1923284111373"><a name="zh-cn_topic_0000001173324643_p1923284111373"></a><a name="zh-cn_topic_0000001173324643_p1923284111373"></a>designWidth</p> 102</td> 103<td class="cellrowborder" valign="top" width="12.218778122187782%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173324643_p1023219418372"><a name="zh-cn_topic_0000001173324643_p1023219418372"></a><a name="zh-cn_topic_0000001173324643_p1023219418372"></a>number</p> 104</td> 105<td class="cellrowborder" valign="top" width="8.37916208379162%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173324643_p023217410379"><a name="zh-cn_topic_0000001173324643_p023217410379"></a><a name="zh-cn_topic_0000001173324643_p023217410379"></a>否</p> 106</td> 107<td class="cellrowborder" valign="top" width="19.748025197480253%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173324643_p15424137103212"><a name="zh-cn_topic_0000001173324643_p15424137103212"></a><a name="zh-cn_topic_0000001173324643_p15424137103212"></a>720</p> 108</td> 109<td class="cellrowborder" valign="top" width="40.095990400959906%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173324643_p1232174173717"><a name="zh-cn_topic_0000001173324643_p1232174173717"></a><a name="zh-cn_topic_0000001173324643_p1232174173717"></a>页面显示设计时的参考值,实际显示效果基于设备宽度与参考值之间的比例进行缩放。</p> 110</td> 111</tr> 112<tr id="zh-cn_topic_0000001173324643_row78924466220"><td class="cellrowborder" valign="top" width="19.558044195580443%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173324643_p1289216461925"><a name="zh-cn_topic_0000001173324643_p1289216461925"></a><a name="zh-cn_topic_0000001173324643_p1289216461925"></a>autoDesignWidth</p> 113</td> 114<td class="cellrowborder" valign="top" width="12.218778122187782%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173324643_p1489220466214"><a name="zh-cn_topic_0000001173324643_p1489220466214"></a><a name="zh-cn_topic_0000001173324643_p1489220466214"></a>boolean</p> 115</td> 116<td class="cellrowborder" valign="top" width="8.37916208379162%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173324643_p10892184612218"><a name="zh-cn_topic_0000001173324643_p10892184612218"></a><a name="zh-cn_topic_0000001173324643_p10892184612218"></a>否</p> 117</td> 118<td class="cellrowborder" valign="top" width="19.748025197480253%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173324643_p10424237183218"><a name="zh-cn_topic_0000001173324643_p10424237183218"></a><a name="zh-cn_topic_0000001173324643_p10424237183218"></a>false</p> 119</td> 120<td class="cellrowborder" valign="top" width="40.095990400959906%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173324643_p198921746524"><a name="zh-cn_topic_0000001173324643_p198921746524"></a><a name="zh-cn_topic_0000001173324643_p198921746524"></a>页面设计基准宽度是否自动计算,当设为true时,designWidth将会被忽略,设计基准宽度由设备宽度与屏幕密度计算得出。</p> 121</td> 122</tr> 123</tbody> 124</table> 125 126示例如下: 127 128``` 129{ 130 ... 131 "window": { 132 "designWidth": 720, 133 "autoDesignWidth": false 134 } 135 ... 136} 137``` 138 139## 示例<a name="zh-cn_topic_0000001173324643_section19421142983812"></a> 140 141``` 142{ 143 "app": { 144 "bundleName": "com.example.player", 145 "version": { 146 "code": 1, 147 "name": "1.0" 148 }, 149 "vendor": "example" 150 } 151 "module": { 152 ... 153 "js": [ 154 { 155 "name": "default", 156 "pages": [ 157 "pages/index/index", 158 "pages/detail/detail" 159 ], 160 "window": { 161 "designWidth": 720, 162 "autoDesignWidth": false 163 } 164 } 165 ], 166 "abilities": [ 167 { 168 ... 169 } 170 ] 171 } 172} 173``` 174 175