@modern-js/module-tools-docs 2.2.0-beta.0 → 2.2.1-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (212) hide show
  1. package/doc_build/static/css/main.css +3 -3
  2. package/doc_build/static/css/main.css.map +1 -1
  3. package/doc_build/static/js/async/en_api_config_build-config.js +2 -2
  4. package/doc_build/static/js/async/en_api_config_build-preset.js +2 -2
  5. package/doc_build/static/js/async/en_api_config_design-system.js +2 -2
  6. package/doc_build/static/js/async/en_api_config_plugins.js +2 -2
  7. package/doc_build/static/js/async/en_api_config_testing.js +2 -2
  8. package/doc_build/static/js/async/en_api_plugin-api_plugin-hooks.js +2 -2
  9. package/doc_build/static/js/async/en_guide_advance_asset.js +2 -2
  10. package/doc_build/static/js/async/en_guide_advance_build-umd.js +4 -4
  11. package/doc_build/static/js/async/en_guide_advance_copy.js +3 -3
  12. package/doc_build/static/js/async/en_guide_advance_external-dependency.js +4 -4
  13. package/doc_build/static/js/async/en_guide_advance_in-depth-about-build.js +5 -5
  14. package/doc_build/static/js/async/en_guide_advance_in-depth-about-dev-command.js +2455 -75
  15. package/doc_build/static/js/async/en_guide_advance_in-depth-about-dev-command.js.map +1 -1
  16. package/doc_build/static/js/async/en_guide_advance_theme-config.js +3 -3
  17. package/doc_build/static/js/async/en_guide_basic_before-getting-started.js +14 -152
  18. package/doc_build/static/js/async/en_guide_basic_before-getting-started.js.map +1 -1
  19. package/doc_build/static/js/async/en_guide_basic_command-preview.js +8 -8
  20. package/doc_build/static/js/async/en_guide_basic_modify-output-product.js +126 -37
  21. package/doc_build/static/js/async/en_guide_basic_modify-output-product.js.map +1 -1
  22. package/doc_build/static/js/async/en_guide_basic_publish-your-project.js +2 -2
  23. package/doc_build/static/js/async/en_guide_basic_test-your-project.js +2 -2
  24. package/doc_build/static/js/async/en_guide_basic_use-micro-generator.js +2791 -4
  25. package/doc_build/static/js/async/en_guide_basic_use-micro-generator.js.map +1 -1
  26. package/doc_build/static/js/async/en_guide_basic_using-storybook.js +10 -10
  27. package/doc_build/static/js/async/en_guide_best-practices_components.js +3 -3
  28. package/doc_build/static/js/async/en_guide_intro_getting-started.js +2 -2
  29. package/doc_build/static/js/async/en_plugins_guide_getting-started.js +2 -2
  30. package/doc_build/static/js/async/en_plugins_guide_plugin-object.js +2 -2
  31. package/doc_build/static/js/async/en_plugins_guide_setup-function.js +2 -2
  32. package/doc_build/static/js/async/zh_api_config_build-config.js +2 -2
  33. package/doc_build/static/js/async/zh_api_config_build-preset.js +2 -2
  34. package/doc_build/static/js/async/zh_api_config_design-system.js +2 -2
  35. package/doc_build/static/js/async/zh_api_config_plugins.js +2 -2
  36. package/doc_build/static/js/async/zh_api_config_testing.js +2 -2
  37. package/doc_build/static/js/async/zh_api_plugin-api_plugin-hooks.js +2 -2
  38. package/doc_build/static/js/async/zh_guide_advance_asset.js +2 -2
  39. package/doc_build/static/js/async/zh_guide_advance_build-umd.js +2 -2
  40. package/doc_build/static/js/async/zh_guide_advance_copy.js +3 -3
  41. package/doc_build/static/js/async/zh_guide_advance_external-dependency.js +3 -3
  42. package/doc_build/static/js/async/zh_guide_advance_in-depth-about-build.js +5 -5
  43. package/doc_build/static/js/async/zh_guide_advance_in-depth-about-dev-command.js +2450 -74
  44. package/doc_build/static/js/async/zh_guide_advance_in-depth-about-dev-command.js.map +1 -1
  45. package/doc_build/static/js/async/zh_guide_advance_theme-config.js +3 -3
  46. package/doc_build/static/js/async/zh_guide_basic_before-getting-started.js +14 -152
  47. package/doc_build/static/js/async/zh_guide_basic_before-getting-started.js.map +1 -1
  48. package/doc_build/static/js/async/zh_guide_basic_command-preview.js +8 -8
  49. package/doc_build/static/js/async/zh_guide_basic_modify-output-product.js +87 -9
  50. package/doc_build/static/js/async/zh_guide_basic_modify-output-product.js.map +1 -1
  51. package/doc_build/static/js/async/zh_guide_basic_publish-your-project.js +7 -7
  52. package/doc_build/static/js/async/zh_guide_basic_test-your-project.js +410 -11
  53. package/doc_build/static/js/async/zh_guide_basic_test-your-project.js.map +1 -1
  54. package/doc_build/static/js/async/zh_guide_basic_use-micro-generator.js +2790 -3
  55. package/doc_build/static/js/async/zh_guide_basic_use-micro-generator.js.map +1 -1
  56. package/doc_build/static/js/async/zh_guide_basic_using-storybook.js +496 -405
  57. package/doc_build/static/js/async/zh_guide_basic_using-storybook.js.map +1 -1
  58. package/doc_build/static/js/async/zh_guide_best-practices_components.js +4 -4
  59. package/doc_build/static/js/async/zh_guide_intro_getting-started.js +2 -2
  60. package/doc_build/static/js/async/zh_plugins_guide_getting-started.js +2 -2
  61. package/doc_build/static/js/async/zh_plugins_guide_plugin-object.js +2 -2
  62. package/doc_build/static/js/async/zh_plugins_guide_setup-function.js +2 -2
  63. package/doc_build/static/js/builder-runtime.js +1 -1
  64. package/doc_build/static/js/builder-runtime.js.map +1 -1
  65. package/doc_build/static/js/main.js +211 -211
  66. package/doc_build/static/js/main.js.map +1 -1
  67. package/doc_build/static/js/vendors-node_modules_pnpm_remix-run_router_1_2_0_node_modules_remix-run_router_dist_router_js-9d5e9c.js +70 -70
  68. package/doc_build/static/js/vendors-node_modules_pnpm_remix-run_router_1_2_0_node_modules_remix-run_router_dist_router_js-9d5e9c.js.map +1 -1
  69. package/doc_build/static/search_index.json +1 -1
  70. package/docs/en/guide/advance/in-depth-about-dev-command.md +65 -12
  71. package/docs/en/guide/basic/before-getting-started.md +4 -14
  72. package/docs/en/guide/basic/command-preview.md +1 -1
  73. package/docs/en/guide/basic/modify-output-product.md +6 -2
  74. package/docs/en/guide/basic/use-micro-generator.md +62 -1
  75. package/docs/en/guide/basic/using-storybook.mdx +4 -4
  76. package/docs/zh/guide/advance/in-depth-about-dev-command.md +60 -13
  77. package/docs/zh/guide/basic/before-getting-started.md +4 -14
  78. package/docs/zh/guide/basic/command-preview.md +2 -2
  79. package/docs/zh/guide/basic/modify-output-product.md +5 -3
  80. package/docs/zh/guide/basic/publish-your-project.md +4 -4
  81. package/docs/zh/guide/basic/test-your-project.mdx +18 -5
  82. package/docs/zh/guide/basic/use-micro-generator.md +61 -1
  83. package/docs/zh/guide/basic/using-storybook.mdx +13 -10
  84. package/package.json +4 -4
  85. package/docs/.island/dist/404.html +0 -41
  86. package/docs/.island/dist/assets/asset.26aea654.js +0 -160
  87. package/docs/.island/dist/assets/asset.36e3d3c9.js +0 -160
  88. package/docs/.island/dist/assets/before-getting-started.0e863740.js +0 -87
  89. package/docs/.island/dist/assets/before-getting-started.2c6e6b8a.js +0 -87
  90. package/docs/.island/dist/assets/build-config.460d11d9.js +0 -804
  91. package/docs/.island/dist/assets/build-config.e155e534.js +0 -854
  92. package/docs/.island/dist/assets/build-preset.6c2c6c62.js +0 -256
  93. package/docs/.island/dist/assets/build-preset.d3da921d.js +0 -256
  94. package/docs/.island/dist/assets/build-umd.ba00f028.js +0 -264
  95. package/docs/.island/dist/assets/build-umd.edb9d163.js +0 -273
  96. package/docs/.island/dist/assets/command-preview.1dc93921.js +0 -264
  97. package/docs/.island/dist/assets/command-preview.ef7a9d01.js +0 -264
  98. package/docs/.island/dist/assets/components.esm.03560353.js +0 -9
  99. package/docs/.island/dist/assets/copy.28dc4d5f.js +0 -277
  100. package/docs/.island/dist/assets/copy.f4625565.js +0 -277
  101. package/docs/.island/dist/assets/design-system.8993234c.js +0 -1254
  102. package/docs/.island/dist/assets/design-system.b0ba163f.js +0 -639
  103. package/docs/.island/dist/assets/dev.b373b152.js +0 -37
  104. package/docs/.island/dist/assets/dev.b39fd42a.js +0 -37
  105. package/docs/.island/dist/assets/down.f35427d3.svg +0 -1
  106. package/docs/.island/dist/assets/extension.4bf3526b.js +0 -1
  107. package/docs/.island/dist/assets/extension.d64ed0b8.js +0 -469
  108. package/docs/.island/dist/assets/external-dependency.2ede7532.js +0 -156
  109. package/docs/.island/dist/assets/external-dependency.92ca89e0.js +0 -156
  110. package/docs/.island/dist/assets/getting-started.822cf0b2.js +0 -117
  111. package/docs/.island/dist/assets/getting-started.e2764829.js +0 -114
  112. package/docs/.island/dist/assets/github.3bf8ccee.svg +0 -1
  113. package/docs/.island/dist/assets/in-depth-about-build.94cc902d.js +0 -375
  114. package/docs/.island/dist/assets/in-depth-about-build.aa74de10.js +0 -374
  115. package/docs/.island/dist/assets/in-depth-about-dev-command.877bdb83.js +0 -33
  116. package/docs/.island/dist/assets/in-depth-about-dev-command.9736befd.js +0 -39
  117. package/docs/.island/dist/assets/index.01786ba7.js +0 -30
  118. package/docs/.island/dist/assets/index.6cef6f5f.js +0 -4
  119. package/docs/.island/dist/assets/index.cb118238.js +0 -36
  120. package/docs/.island/dist/assets/index.ccb6ce27.js +0 -4
  121. package/docs/.island/dist/assets/island_inject.69495876.js +0 -1
  122. package/docs/.island/dist/assets/island_inject.cdfb22d9.js +0 -1
  123. package/docs/.island/dist/assets/loading.8c9bb911.svg +0 -1
  124. package/docs/.island/dist/assets/modify-output-product.9e2394d7.js +0 -100
  125. package/docs/.island/dist/assets/modify-output-product.f363845a.js +0 -100
  126. package/docs/.island/dist/assets/moon.6b705924.svg +0 -3
  127. package/docs/.island/dist/assets/plugin.70a61997.js +0 -42
  128. package/docs/.island/dist/assets/plugin.80b12ee2.js +0 -42
  129. package/docs/.island/dist/assets/publish-your-project.7321c10e.js +0 -164
  130. package/docs/.island/dist/assets/publish-your-project.7326359f.js +0 -166
  131. package/docs/.island/dist/assets/right.89674cd7.svg +0 -1
  132. package/docs/.island/dist/assets/search.0aea6901.svg +0 -1
  133. package/docs/.island/dist/assets/search.11353245.js +0 -222
  134. package/docs/.island/dist/assets/search.a1b1cff3.js +0 -3
  135. package/docs/.island/dist/assets/search.f9025ced.js +0 -3
  136. package/docs/.island/dist/assets/style.09015a4b.css +0 -1
  137. package/docs/.island/dist/assets/style.2e5f7bc2.css +0 -1970
  138. package/docs/.island/dist/assets/sun.841dac10.svg +0 -11
  139. package/docs/.island/dist/assets/test-your-project.8ab2809e.js +0 -190
  140. package/docs/.island/dist/assets/test-your-project.9ae2a49e.js +0 -190
  141. package/docs/.island/dist/assets/test.2bfe276b.js +0 -66
  142. package/docs/.island/dist/assets/test.a2c00a3f.js +0 -67
  143. package/docs/.island/dist/assets/translator.b1077c44.svg +0 -1
  144. package/docs/.island/dist/assets/use-micro-generator.13c1a09f.js +0 -60
  145. package/docs/.island/dist/assets/use-micro-generator.dfe877f6.js +0 -60
  146. package/docs/.island/dist/assets/using-storybook.adb88cb8.js +0 -260
  147. package/docs/.island/dist/assets/using-storybook.b8e7dd04.js +0 -260
  148. package/docs/.island/dist/assets/welcome.94880043.js +0 -13
  149. package/docs/.island/dist/assets/welcome.b2140e7e.js +0 -13
  150. package/docs/.island/dist/assets/why-module-engineering-solution.bfe7981a.js +0 -26
  151. package/docs/.island/dist/assets/why-module-engineering-solution.e31cd19f.js +0 -26
  152. package/docs/.island/dist/chunk-COLCRJ2V.js +0 -1
  153. package/docs/.island/dist/chunk-K5FMOYDC.js +0 -10
  154. package/docs/.island/dist/chunk-WE42KMYS.js +0 -26
  155. package/docs/.island/dist/client-entry.js +0 -3
  156. package/docs/.island/dist/en/api/build-config.html +0 -344
  157. package/docs/.island/dist/en/api/build-preset.html +0 -82
  158. package/docs/.island/dist/en/api/design-system.html +0 -155
  159. package/docs/.island/dist/en/api/dev.html +0 -45
  160. package/docs/.island/dist/en/api/index.html +0 -41
  161. package/docs/.island/dist/en/api/plugin.html +0 -48
  162. package/docs/.island/dist/en/api/test.html +0 -58
  163. package/docs/.island/dist/en/guide/advance/asset.html +0 -68
  164. package/docs/.island/dist/en/guide/advance/build-umd.html +0 -72
  165. package/docs/.island/dist/en/guide/advance/copy.html +0 -82
  166. package/docs/.island/dist/en/guide/advance/extension.html +0 -41
  167. package/docs/.island/dist/en/guide/advance/external-dependency.html +0 -71
  168. package/docs/.island/dist/en/guide/advance/in-depth-about-build.html +0 -148
  169. package/docs/.island/dist/en/guide/advance/in-depth-about-dev-command.html +0 -51
  170. package/docs/.island/dist/en/guide/basic/before-getting-started.html +0 -127
  171. package/docs/.island/dist/en/guide/basic/command-preview.html +0 -100
  172. package/docs/.island/dist/en/guide/basic/modify-output-product.html +0 -140
  173. package/docs/.island/dist/en/guide/basic/publish-your-project.html +0 -91
  174. package/docs/.island/dist/en/guide/basic/test-your-project.html +0 -72
  175. package/docs/.island/dist/en/guide/basic/use-micro-generator.html +0 -65
  176. package/docs/.island/dist/en/guide/basic/using-storybook.html +0 -113
  177. package/docs/.island/dist/en/guide/intro/getting-started.html +0 -76
  178. package/docs/.island/dist/en/guide/intro/welcome.html +0 -53
  179. package/docs/.island/dist/en/guide/intro/why-module-engineering-solution.html +0 -49
  180. package/docs/.island/dist/en/index.html +0 -42
  181. package/docs/.island/dist/react-dom.js +0 -1
  182. package/docs/.island/dist/react-dom_client.js +0 -1
  183. package/docs/.island/dist/react.js +0 -1
  184. package/docs/.island/dist/react_jsx-runtime.js +0 -10
  185. package/docs/.island/dist/ssr-manifest.json +0 -57
  186. package/docs/.island/dist/test-result.png +0 -0
  187. package/docs/.island/dist/why-module-solution.png +0 -0
  188. package/docs/.island/dist/zh/api/build-config.html +0 -361
  189. package/docs/.island/dist/zh/api/build-preset.html +0 -82
  190. package/docs/.island/dist/zh/api/design-system.html +0 -149
  191. package/docs/.island/dist/zh/api/dev.html +0 -46
  192. package/docs/.island/dist/zh/api/index.html +0 -41
  193. package/docs/.island/dist/zh/api/plugin.html +0 -48
  194. package/docs/.island/dist/zh/api/test.html +0 -59
  195. package/docs/.island/dist/zh/guide/advance/asset.html +0 -68
  196. package/docs/.island/dist/zh/guide/advance/build-umd.html +0 -72
  197. package/docs/.island/dist/zh/guide/advance/copy.html +0 -82
  198. package/docs/.island/dist/zh/guide/advance/extension.html +0 -127
  199. package/docs/.island/dist/zh/guide/advance/external-dependency.html +0 -71
  200. package/docs/.island/dist/zh/guide/advance/in-depth-about-build.html +0 -148
  201. package/docs/.island/dist/zh/guide/advance/in-depth-about-dev-command.html +0 -53
  202. package/docs/.island/dist/zh/guide/basic/before-getting-started.html +0 -127
  203. package/docs/.island/dist/zh/guide/basic/command-preview.html +0 -100
  204. package/docs/.island/dist/zh/guide/basic/modify-output-product.html +0 -140
  205. package/docs/.island/dist/zh/guide/basic/publish-your-project.html +0 -92
  206. package/docs/.island/dist/zh/guide/basic/test-your-project.html +0 -72
  207. package/docs/.island/dist/zh/guide/basic/use-micro-generator.html +0 -65
  208. package/docs/.island/dist/zh/guide/basic/using-storybook.html +0 -114
  209. package/docs/.island/dist/zh/guide/intro/getting-started.html +0 -79
  210. package/docs/.island/dist/zh/guide/intro/welcome.html +0 -53
  211. package/docs/.island/dist/zh/guide/intro/why-module-engineering-solution.html +0 -49
  212. package/docs/.island/dist/zh/index.html +0 -42
@@ -19,16 +19,16 @@ sidebar_position: 5
19
19
 
20
20
  因此它是一个复杂且功能强大的工具。
21
21
 
22
- 模块工程解决方案集成了 Storybook ,因此你几乎可以按照 Storybook 官方文档的内容进行使用。不过依然有一些地方需要注意,接下来讲解一下:
22
+ 模块工程解决方案集成了 Storybook,因此你几乎可以按照 Storybook 官方文档的内容进行使用。不过依然有一些地方需要注意,接下来讲解一下。
23
23
 
24
24
  ## 调试代码
25
25
 
26
- 在调试代码过程中需要引入组件代码,目前可以通过两种方式引入组件代码:
26
+ 在调试代码过程中需要引入项目代码,目前可以通过两种方式引入项目代码:
27
27
 
28
- - 引用组件产物
29
- - 引用组件源码
28
+ - 引用项目产物
29
+ - 引用项目源码
30
30
 
31
- 我们更推荐使用第一种“**引用组件产物**”的方式。因为它几乎接近真实的使用场景,不仅可以对组件功能进行调试,同时也对构建产物的正确性进行了验证。
31
+ 我们更推荐使用第一种“**引用项目产物**”的方式。因为它更接近真实的使用场景,不仅可以对组件功能进行调试,同时也对构建产物的正确性进行了验证。
32
32
 
33
33
  接下来我们分别讲一下这两种方式具体如何使用。
34
34
 
@@ -49,7 +49,7 @@ sidebar_position: 5
49
49
  ---
50
50
 
51
51
  确保 `package.json` 的 `main` 和 `types`
52
- 的值为真实的路径。
52
+ 的值为正确的产物路径。
53
53
 
54
54
  ```json package.json
55
55
  {
@@ -70,7 +70,7 @@ export const content = 'hello world';
70
70
  ---
71
71
 
72
72
  确保在 `stories/tsconfig.json` 中设置了指向项目根目录的 `paths` 配置。
73
- `paths` 的 `key` 与项目名称相同。
73
+ `paths` 的 `key` 与项目名称相同,这样在编译过程中以及在代码中不会出现问题。
74
74
 
75
75
  ```json stories/tsconfig.json focus=5:7
76
76
  {
@@ -78,7 +78,8 @@ export const content = 'hello world';
78
78
  "compilerOptions": {
79
79
  "baseUrl": "../",
80
80
  "paths": {
81
- "foo": ["."]
81
+ "foo": ["."],
82
+ "foo/*": ["./*"]
82
83
  }
83
84
  },
84
85
  "include": [
@@ -105,7 +106,8 @@ export default {
105
106
 
106
107
  </CH.Spotlight>
107
108
 
108
- 如果在开发过程中,遇到无法实时获得类型定义的情况,此时:
109
+ :::info
110
+ 在开发过程中,可能会遇到无法实时获得类型定义的情况。因为只有当保存代码后,产物目录下的类型文件才会更新。此时:
109
111
 
110
112
  对于 `pnpm` 的项目,可以按照下面的内容对 `package.json` 进行修改:
111
113
 
@@ -123,11 +125,12 @@ export default {
123
125
  > 关于 pnpm 的 `publishConfig` 的使用,可以阅读下面这个[链接](https://pnpm.io/package_json#publishconfig)。
124
126
 
125
127
  而对于 npm 和 Yarn 的项目,则只能通过手动的方式在**开发阶段**和**发布阶段**对 `package.json` 的 `types` 的值进行修改。
128
+ :::
126
129
 
127
130
  那么为什么可以直接引用产物呢?
128
131
 
129
132
  1. 在执行 `modern dev storybook` 命令之前,会自动执行 `modern build` 命令,保证项目构建产物的存在。
130
- 2. 在 Storybook 内部增加了以项目名称作为别名的处理,保证能够**根据 `package.json` 解析出项目的产物路径**。
133
+ 2. 在 Storybook 内部增加了针对 `tsconfig.json` 文件或者以项目名称作为别名的处理,保证能够**根据 `package.json` 解析出项目的产物路径**。
131
134
 
132
135
  ### 引用组件源码
133
136
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@modern-js/module-tools-docs",
3
- "version": "2.2.0-beta.0",
3
+ "version": "2.2.1-beta.1",
4
4
  "description": "docs",
5
5
  "main": "index.js",
6
6
  "keywords": [],
@@ -8,11 +8,11 @@
8
8
  "license": "ISC",
9
9
  "dependencies": {
10
10
  "@code-hike/mdx": "^0.7.4",
11
- "@modern-js/doc-plugin-auto-sidebar": "2.2.0",
12
- "@modern-js/doc-tools": "2.2.0",
13
11
  "react": "^18.2.0",
14
12
  "react-dom": "^18.2.0",
15
- "shiki": "^0.11.1"
13
+ "shiki": "^0.11.1",
14
+ "@modern-js/doc-tools": "2.2.0",
15
+ "@modern-js/doc-plugin-auto-sidebar": "2.2.0"
16
16
  },
17
17
  "scripts": {
18
18
  "dev": "modern dev",
@@ -1,41 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8">
5
- <meta name="viewport" content="width=device-width,initial-scale=1">
6
- <link rel="icon" href="" type="image/svg+xml"></link>
7
- <script id="check-dark-light">
8
- ;(() => {
9
- const saved = localStorage.getItem('island-theme-appearance')
10
- const prefereDark = window.matchMedia('(prefers-color-scheme: dark)').matches
11
- if (!saved || saved === 'auto' ? prefereDark : saved === 'dark') {
12
- document.documentElement.classList.add('dark')
13
- }
14
- })()
15
- </script>
16
- <title data-rh="true">Module tools</title>
17
- <meta data-rh="true" name="description" content="Island"/>
18
-
19
-
20
- <script defer src='https://ga.jspm.io/npm:es-module-shims@1.6.0/dist/es-module-shims.js'></script>
21
- <script type="importmap">
22
- {
23
- "imports": {
24
- "react": "/react.js","react-dom": "/react-dom.js","react-dom/client": "/react-dom_client.js","react/jsx-runtime": "/react_jsx-runtime.js"
25
- }
26
- }
27
- </script>
28
-
29
- <link rel="stylesheet" href="/assets/style.2e5f7bc2.css">
30
-
31
- </head>
32
- <body>
33
- <div id="root"><div style="height:100%"><header relative="" z="4" fixed="md:~" class="top-0 left-0" w="100%"><div relative="" p="l-8 sm:x-8" transition="background-color duration-500" class="divider-bottom md:border-b-transparent lg:border-b-transparent" nav-h="mobile lg:desktop"><div flex="" justify="between" m="0 auto" nav-h="mobile lg:desktop" class="_container_1ic07_52 "><div shrink="0" border="border t-0 b-1 border-solid transparent" class="_nav-bar-title_1ic07_16"><a href="/zh/" w="100%" h="100%" text="1rem" font="semibold" transition="opacity duration-300" hover="opacity-60" class="flex items-center"><span>Module tools</span></a></div><div class="_content_1ic07_24" flex="~ 1" justify="end" items-center=""><div class="search" flex="sm:1" pl="sm:8"><div __island="Search:1"><div flex="" items-center="~" relative="" mr="2" font="semibold"><svg width="32" height="32" viewBox="0 0 32 32" w="5" h="5" fill="currentColor"><path fill="#888888" d="m29 27.586l-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9a9.01 9.01 0 0 1-9-9Z"></path></svg><input disabled="" cursor="text focus:auto" placeholder="Search" height="8" border="none" type="text" text="sm" p="t-0 r-2 b-0 l-2" transition="all duration-200 ease" class="rounded-sm _searchInput_y03a3_1 " aria-label="Search" autoComplete="off"/><div m="r-3" w="10" h="6" p="x-1.5" rounded="md" border="1px solid gray-light-3" text="xs gray-light-3" flex="~" items-center="~" justify="around" class="_searchCommand_y03a3_7"><span>⌘</span><span>K</span></div></div></div></div><div class="_rightNav_1ic07_42"><div class="menu"><div text="sm" font="medium" m="x-3" class=""><a href="/zh/guide/intro/welcome.html" target="" class="_link_r3fql_1 ">指南</a></div><div text="sm" font="medium" m="x-3" class=""><a href="/zh/api/index.html" target="" class="_link_r3fql_1 ">API</a></div><div m="x-3" last="mr-0"><div __island="NavMenuGroup:4"><div relative=""><button flex="center" nav-h="mobile sm:desktop" font="medium" text="sm text-1 hover:text-2" transition="color duration-200" class="nav-menu-group-button"><span mr="1" text="sm" font="medium">v2.0.0-beta.4</span><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M16 22L6 12l1.4-1.4l8.6 8.6l8.6-8.6L26 12z"></path></svg></button><div absolute="" pos="top-13 right-0" m="x-0.8" transition="opacity duration-300" class="nav-menu-group-content" style="opacity:0;visibility:hidden"><div p="3" w="100%" h="100%" class="min-w-128px max-h-100vh" border-1="" rounded="xl" bg="bg-default" style="box-shadow:var(--island-shadow-3);margin-right:-1.5rem;z-index:100"><div font="medium"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer" class="_link_r3fql_1 "><div rounded="md" hover="bg-bg-mute" p="y-1.6 l-3"><div flex=""><span mr="1">更新日志</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div><div font="medium"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer" class="_link_r3fql_1 "><div rounded="md" hover="bg-bg-mute" p="y-1.6 l-3"><div flex=""><span mr="1">贡献指南</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div></div></div></div></div></div></div><div class="translation" flex="~" text="sm" font="bold" items-center="~" before="menu-item-before"><div m="x-1.5"><div __island="NavMenuGroup:5"><div relative=""><button flex="center" nav-h="mobile sm:desktop" font="medium" text="sm text-1 hover:text-2" transition="color duration-200" class="nav-menu-group-button"><span mr="1" text="sm" font="medium"><svg width="32" height="32" viewBox="0 0 32 32" w="18px" h="18px"><path fill="currentColor" d="M27.85 29H30l-6-15h-2.35l-6 15h2.15l1.6-4h6.85zm-7.65-6l2.62-6.56L25.45 23zM18 7V5h-7V2H9v3H2v2h10.74a14.71 14.71 0 0 1-3.19 6.18A13.5 13.5 0 0 1 7.26 9h-2.1a16.47 16.47 0 0 0 3 5.58A16.84 16.84 0 0 1 3 18l.75 1.86A18.47 18.47 0 0 0 9.53 16a16.92 16.92 0 0 0 5.76 3.84L16 18a14.48 14.48 0 0 1-5.12-3.37A17.64 17.64 0 0 0 14.8 7z"></path></svg></span><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M16 22L6 12l1.4-1.4l8.6 8.6l8.6-8.6L26 12z"></path></svg></button><div absolute="" pos="top-13 right-0" m="x-0.8" transition="opacity duration-300" class="nav-menu-group-content" style="opacity:0;visibility:hidden"><div p="3" w="100%" h="100%" class="min-w-128px max-h-100vh" border-1="" rounded="xl" bg="bg-default" style="box-shadow:var(--island-shadow-3);margin-right:-1.5rem;z-index:100"><div rounded="md" p="y-1.6 l-3"><span mr="1" text="brand">简体中文</span></div><div font="medium"><a href="/en" target="" class="_link_r3fql_1 "><div rounded="md" hover="bg-bg-mute" p="y-1.6 l-3"><div flex=""><span mr="1">English</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div></div></div></div></div></div></div><div class="appearance" before="menu-item-before" display="none sm:flex" items-center="center"><div __island="SwitchAppearance:6"><button class="_switch_1tqe3_1 undefined" id="" type="button" role="switch"><span class="_check_1tqe3_17"><span class="_icon_1tqe3_34"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewBox="0 0 24 24" class="_sun_8e60k_1"><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewBox="0 0 24 24" class="_moon_8e60k_5"><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg></span></span></button></div></div><div __island="SocialLinks:2"><div class="social-links" nav-h="mobile sm:desktop" flex="" items-center="" before="menu-item-before" relative=""><div h="100%" flex="" gap="x-4" items-center="" transition="color duration-300"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer"><div class="_social-links-icon_wx6p9_1"><svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></div></a></div></div></div></div><div __island="NavHamburger:3"><button class=" _navHamburger_14nz8_1"><span class="_container_14nz8_14"><span class="_top_14nz8_21"></span><span class="_middle_14nz8_27"></span><span class="_bottom_14nz8_33"></span></span></button><div class="_navScreen_1mkpq_1 " id="navScreen"><div class="_container_1mkpq_21"><div class="_navMenu_1mkpq_27"><div w="100%" class="_navMenuItem_1mkpq_34"><div text="sm" font="medium" m="x-3" class=""><a href="/zh/guide/intro/welcome.html" target="" class="_link_r3fql_1 ">指南</a></div></div><div w="100%" class="_navMenuItem_1mkpq_34"><div text="sm" font="medium" m="x-3" class=""><a href="/zh/api/index.html" target="" class="_link_r3fql_1 ">API</a></div></div><div w="100%" class="_navMenuItem_1mkpq_34"><div m="x-3" last="mr-0"><div relative="" class=" _navScreenMenuGroup_1xte3_1"><button class="_button_1xte3_12"><span class="_buttonSpan_1xte3_25">v2.0.0-beta.4</span><svg width="1em" height="1em" viewBox="0 0 32 32" class=" _down_1xte3_40 "><path fill="currentColor" d="M16 22L6 12l1.4-1.4l8.6 8.6l8.6-8.6L26 12z"></path></svg></button><div><div class="_items_1xte3_32"><div class="pa-1" font="medium"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer" class="_link_r3fql_1 "><div><div flex=""><span mr="1">更新日志</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div><div class="pa-1" font="medium"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer" class="_link_r3fql_1 "><div><div flex=""><span mr="1">贡献指南</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div></div></div></div></div></div></div><div class="_socialAndAppearance_1mkpq_50" flex="~" justify="center" items-center="center"><div class="items-center appearance pa-2 _navAppearance_1mkpq_46" flex="~" justify="center"><button class="_switch_1tqe3_1 undefined" id="" type="button" role="switch"><span class="_check_1tqe3_17"><span class="_icon_1tqe3_34"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewBox="0 0 24 24" class="_sun_8e60k_1"><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewBox="0 0 24 24" class="_moon_8e60k_5"><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg></span></span></button></div><div __island="SocialLinks:7"><div class="social-links" nav-h="mobile sm:desktop" flex="" items-center="" before="menu-item-before" relative=""><div h="100%" flex="" gap="x-4" items-center="" transition="color duration-300"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer"><div class="_social-links-icon_wx6p9_1"><svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></div></a></div></div></div></div><div flex="~" text="sm" font="bold" justify="center"><div m="x-1.5"><div relative="" class=" _navScreenMenuGroup_1xte3_1"><button class="_button_1xte3_12"><span class="_buttonSpan_1xte3_25"><svg width="32" height="32" viewBox="0 0 32 32" w="18px" h="18px"><path fill="currentColor" d="M27.85 29H30l-6-15h-2.35l-6 15h2.15l1.6-4h6.85zm-7.65-6l2.62-6.56L25.45 23zM18 7V5h-7V2H9v3H2v2h10.74a14.71 14.71 0 0 1-3.19 6.18A13.5 13.5 0 0 1 7.26 9h-2.1a16.47 16.47 0 0 0 3 5.58A16.84 16.84 0 0 1 3 18l.75 1.86A18.47 18.47 0 0 0 9.53 16a16.92 16.92 0 0 0 5.76 3.84L16 18a14.48 14.48 0 0 1-5.12-3.37A17.64 17.64 0 0 0 14.8 7z"></path></svg></span><svg width="1em" height="1em" viewBox="0 0 32 32" class=" _down_1xte3_40 "><path fill="currentColor" d="M16 22L6 12l1.4-1.4l8.6 8.6l8.6-8.6L26 12z"></path></svg></button><div><div class="_items_1xte3_32"><div class="pa-1"><span mr="1" text="brand">简体中文</span></div><div class="pa-1" font="medium"><a href="/en" target="" class="_link_r3fql_1 "><div><div flex=""><span mr="1">English</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div></div></div></div></div></div></div></div></div></div></div></div></header><section style="padding-top:var(--island-nav-height)"><div m="auto t-50" p="t-16 x-6 b-24 sm:t-24 x-8 b-40" text="center" flex="center col"><p text="6xl" font="semibold">404</p><h1 pt="3" text="xl" leading-5="" font="bold">PAGE NOT FOUND</h1><div m="t-6 x-auto b-4.5" w="16" style="height:1px" bg="divider-default"></div><div pt="5"><a inline-block="" border="1px solid brand" rounded="2xl" p="y-1 x-4" text="sm brand" font-medium="" transition="border-color duration-300 color duration-300" hover="border-color-brand-dark color-brand-dark" href="" aria-label="go to home">Take me home</a></div></div></section><div __island="BackTop:0"></div></div></div>
34
-
35
- <script id="island-props">[{},{"langRoutePrefix":"/zh/"},{"socialLinks":[{"icon":"github","mode":"link","content":"https://github.com/modern-js-dev/modern.js"}]},{"localeData":{"lang":"zh","label":"简体中文","lastUpdatedText":"上次更新","nav":[{"text":"指南","link":"/zh/guide/intro/welcome","activeMatch":"/guide/"},{"text":"API","link":"/zh/api/","activeMatch":"/api/"},{"text":"v2.0.0-beta.4","items":[{"text":"更新日志","link":"https://github.com/modern-js-dev/modern.js"},{"text":"贡献指南","link":"https://github.com/modern-js-dev/modern.js"}]}],"sidebar":{"/zh/guide/":[{"text":"介绍","items":[{"text":"欢迎使用","link":"/zh/guide/intro/welcome"},{"text":"为什么需要模块工程解决方案","link":"/zh/guide/intro/why-module-engineering-solution"},{"text":"快速开始","link":"/zh/guide/intro/getting-started"}]},{"text":"基础使用","items":[{"text":"开始之前","link":"/zh/guide/basic/before-getting-started"},{"text":"命令预览","link":"/zh/guide/basic/command-preview"},{"text":"修改输出产物","link":"/zh/guide/basic/modify-output-product"},{"text":"使用微生成器","link":"/zh/guide/basic/use-micro-generator"},{"text":"使用 Storybook","link":"/zh/guide/basic/using-storybook"},{"text":"测试项目","link":"/zh/guide/basic/test-your-project"},{"text":"发布项目","link":"/zh/guide/basic/publish-your-project"}]},{"text":"进阶指南","items":[{"text":"深入理解构建","link":"/zh/guide/advance/in-depth-about-build"},{"text":"深入理解 dev 命令","link":"/zh/guide/advance/in-depth-about-dev-command"},{"text":"使用 Copy 工具","link":"/zh/guide/advance/copy"},{"text":"如何处理第三方依赖","link":"/zh/guide/advance/external-dependency"},{"text":"构建 umd 产物","link":"/zh/guide/advance/build-umd"},{"text":"处理静态文件","link":"/zh/guide/advance/asset"},{"text":"插件扩展","link":"/zh/guide/advance/extension"}]}],"/zh/api/":[{"text":"配置项","items":[{"text":"BuildConfig","link":"/zh/api/build-config"},{"text":"BuildPreset","link":"/zh/api/build-preset"},{"text":"Dev","link":"/zh/api/dev"},{"text":"Test","link":"/zh/api/test"},{"text":"Plugin","link":"/zh/api/plugin"},{"text":"DesignSystem","link":"/zh/api/design-system"}]}]},"title":"Module tools","outlineTitle":"目录","prevPageText":"上一页","nextPageText":"下一页","description":"模块工程解决方案","editLink":{"pattern":"https://github.com/modern-js-dev/modern.js/tree/next/website/module-tools/docs/:path","text":"📝 在 GitHub 上编辑此页"},"langRoutePrefix":"/zh/"},"siteData":{"lang":"en-US","title":"Module tools","description":"Island","themeConfig":{"locales":{"/zh/":{"lang":"zh","label":"简体中文","lastUpdatedText":"上次更新","nav":[{"text":"指南","link":"/zh/guide/intro/welcome","activeMatch":"/guide/"},{"text":"API","link":"/zh/api/","activeMatch":"/api/"},{"text":"v2.0.0-beta.4","items":[{"text":"更新日志","link":"https://github.com/modern-js-dev/modern.js"},{"text":"贡献指南","link":"https://github.com/modern-js-dev/modern.js"}]}],"sidebar":{"/zh/guide/":[{"text":"介绍","items":[{"text":"欢迎使用","link":"/zh/guide/intro/welcome"},{"text":"为什么需要模块工程解决方案","link":"/zh/guide/intro/why-module-engineering-solution"},{"text":"快速开始","link":"/zh/guide/intro/getting-started"}]},{"text":"基础使用","items":[{"text":"开始之前","link":"/zh/guide/basic/before-getting-started"},{"text":"命令预览","link":"/zh/guide/basic/command-preview"},{"text":"修改输出产物","link":"/zh/guide/basic/modify-output-product"},{"text":"使用微生成器","link":"/zh/guide/basic/use-micro-generator"},{"text":"使用 Storybook","link":"/zh/guide/basic/using-storybook"},{"text":"测试项目","link":"/zh/guide/basic/test-your-project"},{"text":"发布项目","link":"/zh/guide/basic/publish-your-project"}]},{"text":"进阶指南","items":[{"text":"深入理解构建","link":"/zh/guide/advance/in-depth-about-build"},{"text":"深入理解 dev 命令","link":"/zh/guide/advance/in-depth-about-dev-command"},{"text":"使用 Copy 工具","link":"/zh/guide/advance/copy"},{"text":"如何处理第三方依赖","link":"/zh/guide/advance/external-dependency"},{"text":"构建 umd 产物","link":"/zh/guide/advance/build-umd"},{"text":"处理静态文件","link":"/zh/guide/advance/asset"},{"text":"插件扩展","link":"/zh/guide/advance/extension"}]}],"/zh/api/":[{"text":"配置项","items":[{"text":"BuildConfig","link":"/zh/api/build-config"},{"text":"BuildPreset","link":"/zh/api/build-preset"},{"text":"Dev","link":"/zh/api/dev"},{"text":"Test","link":"/zh/api/test"},{"text":"Plugin","link":"/zh/api/plugin"},{"text":"DesignSystem","link":"/zh/api/design-system"}]}]},"title":"Module tools","outlineTitle":"目录","prevPageText":"上一页","nextPageText":"下一页","description":"模块工程解决方案","editLink":{"pattern":"https://github.com/modern-js-dev/modern.js/tree/next/website/module-tools/docs/:path","text":"📝 在 GitHub 上编辑此页"}},"/en/":{"lang":"en","label":"English","lastUpdated":"Last Updated","nav":[{"text":"Guide","link":"/en/guide/intro/welcome","activeMatch":"/guide/"},{"text":"API","link":"/en/api/","activeMatch":"/api/"},{"text":"v2.0.0-beta.4","items":[{"text":"Changelog","link":"https://github.com/modern-js-dev/modern.js"},{"text":"Contributing","link":"https://github.com/modern-js-dev/modern.js"}]}],"sidebar":{"/en/guide/":[{"text":"Introduction","items":[{"text":"WelCome","link":"/en/guide/intro/welcome"},{"text":"Why module project solution","link":"/en/guide/intro/why-module-engineering-solution"},{"text":"Getting Started","link":"/en/guide/intro/getting-started"}]},{"text":"Basic Guide","items":[{"text":"Before getting started","link":"/en/guide/basic/before-getting-started"},{"text":"Command preview","link":"/en/guide/basic/command-preview"},{"text":"Modify output product","link":"/en/guide/basic/modify-output-product"},{"text":"Use Micro generator","link":"/en/guide/basic/use-micro-generator"},{"text":"Using Storybook","link":"/en/guide/basic/using-storybook"},{"text":"Test project","link":"/en/guide/basic/test-your-project"},{"text":"Publish project","link":"/en/guide/basic/publish-your-project"}]},{"text":"Advanced Guide","items":[{"text":"In depth about build","link":"/en/guide/advance/in-depth-about-build"},{"text":"In depth about dev command","link":"/en/guide/advance/in-depth-about-dev-command"},{"text":"Use Copy Tools","link":"/en/guide/advance/copy"},{"text":"How to handle third-party dependencies","link":"/en/guide/advance/external-dependency"},{"text":"Build umd","link":"/en/guide/advance/build-umd"},{"text":"Handling static files","link":"/en/guide/advance/asset"},{"text":"Plugins extension","link":"/en/guide/advance/extension"}]}],"/en/api/":[{"text":"Config","items":[{"text":"BuildConfig","link":"/en/api/build-config"},{"text":"BuildPreset","link":"/en/api/build-preset"},{"text":"Dev","link":"/en/api/dev"},{"text":"Test","link":"/en/api/test"},{"text":"Plugin","link":"/en/api/plugin"},{"text":"DesignSystem","link":"/en/api/design-system"}]}]},"title":"Module tools","description":"Module Engineering Solutions","lastUpdatedText":"Last Updated","editLink":{"pattern":"https://github.com/modern-js-dev/modern.js/tree/next/website/module-tools/docs/:path","text":"📝 Edit this page on GitHub"}}},"outlineTitle":"ON THIS PAGE","socialLinks":[{"icon":"github","mode":"link","content":"https://github.com/modern-js-dev/modern.js"}],"footer":{"message":"The Module Engineering Solutions","copyright":"\nCopyright © 2022 ByteDance."}},"head":[["script",{"id":"check-dark-light"},"\n ;(() => {\n const saved = localStorage.getItem('island-theme-appearance')\n const prefereDark = window.matchMedia('(prefers-color-scheme: dark)').matches\n if (!saved || saved === 'auto' ? prefereDark : saved === 'dark') {\n document.documentElement.classList.add('dark')\n }\n })()\n "]],"base":"","icon":"","root":"/Users/targeral/github/targeral-modern-js/website/module-tools/docs","appearance":true},"pathname":"/404"},{"text":"v2.0.0-beta.4","items":[{"text":"更新日志","link":"https://github.com/modern-js-dev/modern.js"},{"text":"贡献指南","link":"https://github.com/modern-js-dev/modern.js"}]},{"items":[{"text":"简体中文","link":"/zh"},{"text":"English","link":"/en"}],"activeIndex":0,"isTranslation":true},{},{"socialLinks":[{"icon":"github","mode":"link","content":"https://github.com/modern-js-dev/modern.js"}]}]</script><script type="module" src="/assets/island_inject.cdfb22d9.js"></script>
36
- <script type="module">import Le,{createContext as ke}from"react";import{jsx as Ce}from"react/jsx-runtime";const Ae="modulepreload",Ie=function(e){return"/"+e},ne={},Oe=function(t,n,i){return!n||n.length===0?t():Promise.all(n.map(r=>{if(r=Ie(r),r in ne)return;ne[r]=!0;const s=r.endsWith(".css"),p=s?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${r}"]${p}`))return;const a=document.createElement("link");if(a.rel=s?"stylesheet":Ae,s||(a.as="script",a.crossOrigin=""),a.href=r,document.head.appendChild(a),s)return new Promise((f,_)=>{a.addEventListener("load",f),a.addEventListener("error",()=>_(new Error(`Unable to preload CSS for ${r}`)))})})).then(()=>t())};const me=()=>typeof window<"u";ke({data:me()?window==null?void 0:window.ISLAND_PAGE_DATA:null,setData:e=>{}});const je="island-theme-appearance";let He,W,V;typeof window<"u"&&typeof localStorage<"u"&&(W=localStorage.getItem(je)||"auto",V=window.matchMedia("(prefers-color-scheme: dark)"),W==="auto"&&V.matches,V.onchange=e=>{W==="auto"&&Ne(e.matches)});const Ne=e=>{He[e?"add":"remove"]("dark")};var Re=typeof global=="object"&&global&&global.Object===Object&&global;const Pe=Re;var $e=typeof self=="object"&&self&&self.Object===Object&&self,De=Pe||$e||Function("return this")();const ue=De;var qe=ue.Symbol;const Y=qe;var pe=Object.prototype,Me=pe.hasOwnProperty,Be=pe.toString,D=Y?Y.toStringTag:void 0;function Ue(e){var t=Me.call(e,D),n=e[D];try{e[D]=void 0;var i=!0}catch{}var r=Be.call(e);return i&&(t?e[D]=n:delete e[D]),r}var We=Object.prototype,Ge=We.toString;function Fe(e){return Ge.call(e)}var Ye="[object Null]",Ke="[object Undefined]",oe=Y?Y.toStringTag:void 0;function Xe(e){return e==null?e===void 0?Ke:Ye:oe&&oe in Object(e)?Ue(e):Fe(e)}function Ze(e){return e!=null&&typeof e=="object"}var Ve="[object Symbol]";function Je(e){return typeof e=="symbol"||Ze(e)&&Xe(e)==Ve}var Qe=/\s/;function et(e){for(var t=e.length;t--&&Qe.test(e.charAt(t)););return t}var tt=/^\s+/;function nt(e){return e&&e.slice(0,et(e)+1).replace(tt,"")}function K(e){var t=typeof e;return e!=null&&(t=="object"||t=="function")}var re=0/0,ot=/^[-+]0x[0-9a-f]+$/i,rt=/^0b[01]+$/i,at=/^0o[0-7]+$/i,it=parseInt;function ae(e){if(typeof e=="number")return e;if(Je(e))return re;if(K(e)){var t=typeof e.valueOf=="function"?e.valueOf():e;e=K(t)?t+"":t}if(typeof e!="string")return e===0?e:+e;e=nt(e);var n=rt.test(e);return n||at.test(e)?it(e.slice(2),n?2:8):ot.test(e)?re:+e}var ct=function(){return ue.Date.now()};const J=ct;var st="Expected a function",dt=Math.max,lt=Math.min;function mt(e,t,n){var i,r,s,p,a,f,_=0,g=!1,w=!1,z=!0;if(typeof e!="function")throw new TypeError(st);t=ae(t)||0,K(n)&&(g=!!n.leading,w="maxWait"in n,s=w?dt(ae(n.maxWait)||0,t):s,z="trailing"in n?!!n.trailing:z);function L(h){var m=i,o=r;return i=r=void 0,_=h,p=e.apply(o,m),p}function E(h){return _=h,a=setTimeout(H,t),g?L(h):p}function A(h){var m=h-f,o=h-_,O=t-m;return w?lt(O,s-o):O}function M(h){var m=h-f,o=h-_;return f===void 0||m>=t||m<0||w&&o>=s}function H(){var h=J();if(M(h))return B(h);a=setTimeout(H,A(h))}function B(h){return a=void 0,z&&i?L(h):(i=r=void 0,p)}function x(){a!==void 0&&clearTimeout(a),_=0,i=f=r=a=void 0}function N(){return a===void 0?p:B(J())}function C(){var h=J(),m=M(h);if(i=arguments,r=this,f=h,m){if(a===void 0)return E(f);if(w)return clearTimeout(a),a=setTimeout(H,t),L(f)}return a===void 0&&(a=setTimeout(H,t)),p}return C.cancel=x,C.flush=N,C}var ut="Expected a function";function pt(e,t,n){var i=!0,r=!0;if(typeof e!="function")throw new TypeError(ut);return K(n)&&(i="leading"in n?!!n.leading:i,r="trailing"in n?!!n.trailing:r),mt(e,t,{leading:i,maxWait:t,trailing:r})}var ft=function(){var e=document.getSelection();if(!e.rangeCount)return function(){};for(var t=document.activeElement,n=[],i=0;i<e.rangeCount;i++)n.push(e.getRangeAt(i));switch(t.tagName.toUpperCase()){case"INPUT":case"TEXTAREA":t.blur();break;default:t=null;break}return e.removeAllRanges(),function(){e.type==="Caret"&&e.removeAllRanges(),e.rangeCount||n.forEach(function(r){e.addRange(r)}),t&&t.focus()}},gt=ft,ie={"text/plain":"Text","text/html":"Url",default:"Text"},vt="Copy to clipboard: #{key}, Enter";function ht(e){var t=(/mac os x/i.test(navigator.userAgent)?"\u2318":"Ctrl")+"+C";return e.replace(/#{\s*key\s*}/g,t)}function _t(e,t){var n,i,r,s,p,a,f=!1;t||(t={}),n=t.debug||!1;try{r=gt(),s=document.createRange(),p=document.getSelection(),a=document.createElement("span"),a.textContent=e,a.ariaHidden="true",a.style.all="unset",a.style.position="fixed",a.style.top=0,a.style.clip="rect(0, 0, 0, 0)",a.style.whiteSpace="pre",a.style.webkitUserSelect="text",a.style.MozUserSelect="text",a.style.msUserSelect="text",a.style.userSelect="text",a.addEventListener("copy",function(g){if(g.stopPropagation(),t.format)if(g.preventDefault(),typeof g.clipboardData>"u"){n&&console.warn("unable to use e.clipboardData"),n&&console.warn("trying IE specific stuff"),window.clipboardData.clearData();var w=ie[t.format]||ie.default;window.clipboardData.setData(w,e)}else g.clipboardData.clearData(),g.clipboardData.setData(t.format,e);t.onCopy&&(g.preventDefault(),t.onCopy(g.clipboardData))}),document.body.appendChild(a),s.selectNodeContents(a),p.addRange(s);var _=document.execCommand("copy");if(!_)throw new Error("copy command was unsuccessful");f=!0}catch(g){n&&console.error("unable to copy using execCommand: ",g),n&&console.warn("trying IE specific stuff");try{window.clipboardData.setData(t.format||"text",e),t.onCopy&&t.onCopy(window.clipboardData),f=!0}catch(w){n&&console.error("unable to copy using clipboardData: ",w),n&&console.error("falling back to prompt"),i=ht("message"in t?t.message:vt),window.prompt(i,e)}}finally{p&&(typeof p.removeRange=="function"?p.removeRange(s):p.removeAllRanges()),a&&document.body.removeChild(a),r()}return f}var yt=_t;function bt(){const e=new Map;window.addEventListener("click",t=>{var i;const n=t.target;if(n.matches('div[class*="language-"] > button.copy')){const r=n.parentElement,s=(i=n.nextElementSibling)==null?void 0:i.nextElementSibling;if(!r||!s)return;const{innerText:p=""}=s;if(yt(p)){n.classList.add("copied"),clearTimeout(e.get(n));const f=setTimeout(()=>{n.classList.remove("copied"),n.blur(),e.delete(n)},2e3);e.set(n,f)}}})}/*! medium-zoom 1.0.6 | MIT License | https://github.com/francoischalifour/medium-zoom */var j=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e},G=function(t){return t.tagName==="IMG"},wt=function(t){return NodeList.prototype.isPrototypeOf(t)},F=function(t){return t&&t.nodeType===1},ce=function(t){var n=t.currentSrc||t.src;return n.substr(-4).toLowerCase()===".svg"},se=function(t){try{return Array.isArray(t)?t.filter(G):wt(t)?[].slice.call(t).filter(G):F(t)?[t].filter(G):typeof t=="string"?[].slice.call(document.querySelectorAll(t)).filter(G):[]}catch{throw new TypeError(`The provided selector is invalid.
37
- Expects a CSS selector, a Node element, a NodeList or an array.
38
- See: https://github.com/francoischalifour/medium-zoom`)}},Et=function(t){var n=document.createElement("div");return n.classList.add("medium-zoom-overlay"),n.style.background=t,n},xt=function(t){var n=t.getBoundingClientRect(),i=n.top,r=n.left,s=n.width,p=n.height,a=t.cloneNode(),f=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,_=window.pageXOffset||document.documentElement.scrollLeft||document.body.scrollLeft||0;return a.removeAttribute("id"),a.style.position="absolute",a.style.top=i+f+"px",a.style.left=r+_+"px",a.style.width=s+"px",a.style.height=p+"px",a.style.transform="",a},P=function(t,n){var i=j({bubbles:!1,cancelable:!1,detail:void 0},n);if(typeof window.CustomEvent=="function")return new CustomEvent(t,i);var r=document.createEvent("CustomEvent");return r.initCustomEvent(t,i.bubbles,i.cancelable,i.detail),r},Tt=function e(t){var n=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},i=window.Promise||function(c){function d(){}c(d,d)},r=function(c){var d=c.target;if(d===O){E();return}x.indexOf(d)!==-1&&A({target:d})},s=function(){if(!(C||!o.original)){var c=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0;Math.abs(h-c)>m.scrollOffset&&setTimeout(E,150)}},p=function(c){var d=c.key||c.keyCode;(d==="Escape"||d==="Esc"||d===27)&&E()},a=function(){var c=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},d=c;if(c.background&&(O.style.background=c.background),c.container&&c.container instanceof Object&&(d.container=j({},m.container,c.container)),c.template){var v=F(c.template)?c.template:document.querySelector(c.template);d.template=v}return m=j({},m,d),x.forEach(function(y){y.dispatchEvent(P("medium-zoom:update",{detail:{zoom:b}}))}),b},f=function(){var c=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};return e(j({},m,c))},_=function(){for(var c=arguments.length,d=Array(c),v=0;v<c;v++)d[v]=arguments[v];var y=d.reduce(function(u,S){return[].concat(u,se(S))},[]);return y.filter(function(u){return x.indexOf(u)===-1}).forEach(function(u){x.push(u),u.classList.add("medium-zoom-image")}),N.forEach(function(u){var S=u.type,k=u.listener,R=u.options;y.forEach(function(I){I.addEventListener(S,k,R)})}),b},g=function(){for(var c=arguments.length,d=Array(c),v=0;v<c;v++)d[v]=arguments[v];o.zoomed&&E();var y=d.length>0?d.reduce(function(u,S){return[].concat(u,se(S))},[]):x;return y.forEach(function(u){u.classList.remove("medium-zoom-image"),u.dispatchEvent(P("medium-zoom:detach",{detail:{zoom:b}}))}),x=x.filter(function(u){return y.indexOf(u)===-1}),b},w=function(c,d){var v=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};return x.forEach(function(y){y.addEventListener("medium-zoom:"+c,d,v)}),N.push({type:"medium-zoom:"+c,listener:d,options:v}),b},z=function(c,d){var v=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};return x.forEach(function(y){y.removeEventListener("medium-zoom:"+c,d,v)}),N=N.filter(function(y){return!(y.type==="medium-zoom:"+c&&y.listener.toString()===d.toString())}),b},L=function(){var c=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},d=c.target,v=function(){var u={width:document.documentElement.clientWidth,height:document.documentElement.clientHeight,left:0,top:0,right:0,bottom:0},S=void 0,k=void 0;if(m.container)if(m.container instanceof Object)u=j({},u,m.container),S=u.width-u.left-u.right-m.margin*2,k=u.height-u.top-u.bottom-m.margin*2;else{var R=F(m.container)?m.container:document.querySelector(m.container),I=R.getBoundingClientRect(),X=I.width,ve=I.height,he=I.left,_e=I.top;u=j({},u,{width:X,height:ve,left:he,top:_e})}S=S||u.width-m.margin*2,k=k||u.height-m.margin*2;var $=o.zoomedHd||o.original,ye=ce($)?S:$.naturalWidth||S,be=ce($)?k:$.naturalHeight||k,U=$.getBoundingClientRect(),we=U.top,Ee=U.left,Q=U.width,ee=U.height,xe=Math.min(ye,S)/Q,Te=Math.min(be,k)/ee,Z=Math.min(xe,Te),Se=(-Ee+(S-Q)/2+m.margin+u.left)/Z,ze=(-we+(k-ee)/2+m.margin+u.top)/Z,te="scale("+Z+") translate3d("+Se+"px, "+ze+"px, 0)";o.zoomed.style.transform=te,o.zoomedHd&&(o.zoomedHd.style.transform=te)};return new i(function(y){if(d&&x.indexOf(d)===-1){y(b);return}var u=function X(){C=!1,o.zoomed.removeEventListener("transitionend",X),o.original.dispatchEvent(P("medium-zoom:opened",{detail:{zoom:b}})),y(b)};if(o.zoomed){y(b);return}if(d)o.original=d;else if(x.length>0){var S=x;o.original=S[0]}else{y(b);return}if(o.original.dispatchEvent(P("medium-zoom:open",{detail:{zoom:b}})),h=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,C=!0,o.zoomed=xt(o.original),document.body.appendChild(O),m.template){var k=F(m.template)?m.template:document.querySelector(m.template);o.template=document.createElement("div"),o.template.appendChild(k.content.cloneNode(!0)),document.body.appendChild(o.template)}if(document.body.appendChild(o.zoomed),window.requestAnimationFrame(function(){document.body.classList.add("medium-zoom--opened")}),o.original.classList.add("medium-zoom-image--hidden"),o.zoomed.classList.add("medium-zoom-image--opened"),o.zoomed.addEventListener("click",E),o.zoomed.addEventListener("transitionend",u),o.original.getAttribute("data-zoom-src")){o.zoomedHd=o.zoomed.cloneNode(),o.zoomedHd.removeAttribute("srcset"),o.zoomedHd.removeAttribute("sizes"),o.zoomedHd.src=o.zoomed.getAttribute("data-zoom-src"),o.zoomedHd.onerror=function(){clearInterval(R),console.warn("Unable to reach the zoom image target "+o.zoomedHd.src),o.zoomedHd=null,v()};var R=setInterval(function(){o.zoomedHd.complete&&(clearInterval(R),o.zoomedHd.classList.add("medium-zoom-image--opened"),o.zoomedHd.addEventListener("click",E),document.body.appendChild(o.zoomedHd),v())},10)}else if(o.original.hasAttribute("srcset")){o.zoomedHd=o.zoomed.cloneNode(),o.zoomedHd.removeAttribute("sizes"),o.zoomedHd.removeAttribute("loading");var I=o.zoomedHd.addEventListener("load",function(){o.zoomedHd.removeEventListener("load",I),o.zoomedHd.classList.add("medium-zoom-image--opened"),o.zoomedHd.addEventListener("click",E),document.body.appendChild(o.zoomedHd),v()})}else v()})},E=function(){return new i(function(c){if(C||!o.original){c(b);return}var d=function v(){o.original.classList.remove("medium-zoom-image--hidden"),document.body.removeChild(o.zoomed),o.zoomedHd&&document.body.removeChild(o.zoomedHd),document.body.removeChild(O),o.zoomed.classList.remove("medium-zoom-image--opened"),o.template&&document.body.removeChild(o.template),C=!1,o.zoomed.removeEventListener("transitionend",v),o.original.dispatchEvent(P("medium-zoom:closed",{detail:{zoom:b}})),o.original=null,o.zoomed=null,o.zoomedHd=null,o.template=null,c(b)};C=!0,document.body.classList.remove("medium-zoom--opened"),o.zoomed.style.transform="",o.zoomedHd&&(o.zoomedHd.style.transform=""),o.template&&(o.template.style.transition="opacity 150ms",o.template.style.opacity=0),o.original.dispatchEvent(P("medium-zoom:close",{detail:{zoom:b}})),o.zoomed.addEventListener("transitionend",d)})},A=function(){var c=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},d=c.target;return o.original?E():L({target:d})},M=function(){return m},H=function(){return x},B=function(){return o.original},x=[],N=[],C=!1,h=0,m=n,o={original:null,zoomed:null,zoomedHd:null,template:null};Object.prototype.toString.call(t)==="[object Object]"?m=t:(t||typeof t=="string")&&_(t),m=j({margin:0,background:"#fff",scrollOffset:40,container:null,template:null},m);var O=Et(m.background);document.addEventListener("click",r),document.addEventListener("keyup",p),document.addEventListener("scroll",s),window.addEventListener("resize",E);var b={open:L,close:E,toggle:A,update:a,clone:f,attach:_,detach:g,on:w,off:z,getOptions:M,getImages:H,getZoomedImage:B};return b};function St(e,t){t===void 0&&(t={});var n=t.insertAt;if(!(!e||typeof document>"u")){var i=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css",n==="top"&&i.firstChild?i.insertBefore(r,i.firstChild):i.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}var zt=".medium-zoom-overlay{position:fixed;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .3s;will-change:opacity}.medium-zoom--opened .medium-zoom-overlay{cursor:pointer;cursor:zoom-out;opacity:1}.medium-zoom-image{cursor:pointer;cursor:zoom-in;transition:transform .3s cubic-bezier(.2,0,.2,1)!important}.medium-zoom-image--hidden{visibility:hidden}.medium-zoom-image--opened{position:relative;cursor:pointer;cursor:zoom-out;will-change:transform}";St(zt);const Lt=Tt,kt=60;function Ct(){function e(t,n,i=!1){let r=null;try{r=t.classList.contains("header-anchor")?t:document.getElementById(decodeURIComponent(n.slice(1)))}catch(s){console.warn(s)}if(r){const s=parseInt(window.getComputedStyle(r).paddingTop,10),p=window.scrollY+r.getBoundingClientRect().top-kt+s;window.scrollTo({left:0,top:p,...i?{behavior:"smooth"}:{}})}}window.addEventListener("click",t=>{const n=t.target.closest("a");if(n){const{origin:i,hash:r,target:s,pathname:p,search:a}=n,f=window.location;r&&s!=="_blank"&&i===f.origin&&p===f.pathname&&a===f.search&&r&&r!==f.hash&&n.classList.contains("header-anchor")&&(t.preventDefault(),history.pushState(null,"",r),e(n,r,!0),window.dispatchEvent(new Event("hashchange")))}},{capture:!0}),window.addEventListener("hashchange",t=>{t.preventDefault()})}function At(){function e(){return document.documentElement.scrollTop+window.innerHeight>=document.documentElement.scrollHeight}const t=60,n=document.getElementById("aside-marker"),i=document.getElementById("aside-container"),r=document.querySelectorAll(".island-doc .header-anchor");let s=null;const p=Array.from((i==null?void 0:i.getElementsByTagName("a"))||[]).map(g=>decodeURIComponent(g.hash));if(n&&!p.length){n.style.opacity="0";return}const a=(g,w)=>{if(s&&s.classList.remove("aside-active"),g[w]){g[w].classList.add("aside-active");const z=g[w].getAttribute("href"),L=p.findIndex(A=>A===z),E=i==null?void 0:i.querySelector(`a[href="#${z==null?void 0:z.slice(1)}"]`);E&&(s=E,s.classList.add("aside-active"),n.style.top=`${33+L*28}px`,n.style.opacity="1")}},f=()=>{if(e())a(r,r.length-1);else for(let g=0;g<r.length;g++){const w=r[g],z=r[g+1],L=window.scrollY,E=w.parentElement.offsetTop-t;if(g===0&&L===0&&a(r,0),!z){a(r,g);break}const A=z.parentElement.offsetTop-t;if(L>E&&L<A){a(r,g);break}}},_=pt(f,100);return requestAnimationFrame(f),window.addEventListener("scroll",_),()=>{window.removeEventListener("scroll",_)}}function It(){const e=document.querySelectorAll("img");Lt(e,{margin:100,background:"rgba(0, 0, 0, 0.7)"})}function Ot(){!me()||(At(),Ct(),bt(),It())}if(typeof window<"u"){var de={get passive(){}};window.addEventListener("testPassive",null,de),window.removeEventListener("testPassive",null,de)}typeof window<"u"&&window.navigator&&window.navigator.platform&&(/iP(ad|hone|od)/.test(window.navigator.platform)||window.navigator.platform==="MacIntel"&&window.navigator.maxTouchPoints>1);var l={exports:{}},jt="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED",Ht=jt,Nt=Ht;function fe(){}function ge(){}ge.resetWarningCache=fe;var Rt=function(){function e(i,r,s,p,a,f){if(f!==Nt){var _=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw _.name="Invariant Violation",_}}e.isRequired=e;function t(){return e}var n={array:e,bigint:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:ge,resetWarningCache:fe};return n.PropTypes=n,n};l.exports=Rt();var q={BASE:"base",BODY:"body",HEAD:"head",HTML:"html",LINK:"link",META:"meta",NOSCRIPT:"noscript",SCRIPT:"script",STYLE:"style",TITLE:"title",FRAGMENT:"Symbol(react.fragment)"};Object.keys(q).map(function(e){return q[e]});var le={accesskey:"accessKey",charset:"charSet",class:"className",contenteditable:"contentEditable",contextmenu:"contextMenu","http-equiv":"httpEquiv",itemprop:"itemProp",tabindex:"tabIndex"};Object.keys(le).reduce(function(e,t){return e[le[t]]=t,e},{});q.NOSCRIPT,q.SCRIPT,q.STYLE;Le.createContext({});var Pt=l.exports.shape({setHelmet:l.exports.func,helmetInstances:l.exports.shape({get:l.exports.func,add:l.exports.func,remove:l.exports.func})});l.exports.shape({helmet:l.exports.shape()}),l.exports.node.isRequired;Pt.isRequired;l.exports.object,l.exports.object,l.exports.oneOfType([l.exports.arrayOf(l.exports.node),l.exports.node]),l.exports.string,l.exports.bool,l.exports.bool,l.exports.object,l.exports.arrayOf(l.exports.object),l.exports.arrayOf(l.exports.object),l.exports.arrayOf(l.exports.object),l.exports.func,l.exports.arrayOf(l.exports.object),l.exports.arrayOf(l.exports.object),l.exports.string,l.exports.object,l.exports.string,l.exports.bool,l.exports.object;async function $t(){if(!document.getElementById("root"))throw new Error("#root element not found");{const t=document.querySelectorAll("[__island]");if(t.length===0)return;const{hydrateRoot:n}=await Oe(()=>import("react-dom/client"),[]);for(let i=0;i<t.length;i++){const r=t[i],[s,p]=r.getAttribute("__island").split(":"),a=window.ISLANDS[s];n(r,Ce(a,{...window.ISLAND_PROPS[p]}))}}}$t().then(()=>{setTimeout(()=>{Ot()})});
39
- </script>
40
- </body>
41
- </html>
@@ -1,160 +0,0 @@
1
- import{jsx as o,jsxs as t,Fragment as r}from"react/jsx-runtime";import{a as l,S as d,b as p}from"./components.esm.03560353.js";import"react";import"react-dom";const n={annotations:l,Spotlight:d,CodeSlot:p},a={staticMediaQuery:"not screen, (max-width: 768px)",theme:{name:"nord",type:"dark",semanticHighlighting:!0,colors:{focusBorder:"#3b4252",foreground:"#d8dee9","activityBar.background":"#2e3440","activityBar.dropBackground":"#3b4252","activityBar.foreground":"#d8dee9","activityBar.activeBorder":"#88c0d0","activityBar.activeBackground":"#3b4252","activityBarBadge.background":"#88c0d0","activityBarBadge.foreground":"#2e3440","badge.foreground":"#2e3440","badge.background":"#88c0d0","button.background":"#88c0d0ee","button.foreground":"#2e3440","button.hoverBackground":"#88c0d0","button.secondaryBackground":"#434c5e","button.secondaryForeground":"#d8dee9","button.secondaryHoverBackground":"#4c566a","charts.red":"#bf616a","charts.blue":"#81a1c1","charts.yellow":"#ebcb8b","charts.orange":"#d08770","charts.green":"#a3be8c","charts.purple":"#b48ead","charts.foreground":"#d8dee9","charts.lines":"#88c0d0","debugConsole.infoForeground":"#88c0d0","debugConsole.warningForeground":"#ebcb8b","debugConsole.errorForeground":"#bf616a","debugConsole.sourceForeground":"#616e88","debugConsoleInputIcon.foreground":"#81a1c1","debugExceptionWidget.background":"#4c566a","debugExceptionWidget.border":"#2e3440","debugToolBar.background":"#3b4252",descriptionForeground:"#d8dee9e6","diffEditor.insertedTextBackground":"#81a1c133","diffEditor.removedTextBackground":"#bf616a4d","dropdown.background":"#3b4252","dropdown.border":"#3b4252","dropdown.foreground":"#d8dee9","editorActiveLineNumber.foreground":"#d8dee9cc","editorCursor.foreground":"#d8dee9","editorHint.border":"#ebcb8b00","editorHint.foreground":"#ebcb8b","editorIndentGuide.background":"#434c5eb3","editorIndentGuide.activeBackground":"#4c566a","editorInlayHint.background":"#434c5e","editorInlayHint.foreground":"#d8dee9","editorLineNumber.foreground":"#4c566a","editorLineNumber.activeForeground":"#d8dee9","editorWhitespace.foreground":"#4c566ab3","editorWidget.background":"#2e3440","editorWidget.border":"#3b4252","editor.background":"#2e3440","editor.foreground":"#d8dee9","editor.hoverHighlightBackground":"#3b4252","editor.findMatchBackground":"#88c0d066","editor.findMatchHighlightBackground":"#88c0d033","editor.findRangeHighlightBackground":"#88c0d033","editor.lineHighlightBackground":"#3b4252","editor.lineHighlightBorder":"#3b4252","editor.inactiveSelectionBackground":"#434c5ecc","editor.inlineValuesBackground":"#4c566a","editor.inlineValuesForeground":"#eceff4","editor.selectionBackground":"#434c5ecc","editor.selectionHighlightBackground":"#434c5ecc","editor.rangeHighlightBackground":"#434c5e52","editor.wordHighlightBackground":"#81a1c166","editor.wordHighlightStrongBackground":"#81a1c199","editor.stackFrameHighlightBackground":"#5e81ac","editor.focusedStackFrameHighlightBackground":"#5e81ac","editorError.foreground":"#bf616a","editorError.border":"#bf616a00","editorWarning.foreground":"#ebcb8b","editorWarning.border":"#ebcb8b00","editorBracketMatch.background":"#2e344000","editorBracketMatch.border":"#88c0d0","editorBracketHighlight.foreground1":"#8fbcbb","editorBracketHighlight.foreground2":"#88c0d0","editorBracketHighlight.foreground3":"#81a1c1","editorBracketHighlight.foreground4":"#5e81ac","editorBracketHighlight.foreground5":"#8fbcbb","editorBracketHighlight.foreground6":"#88c0d0","editorBracketHighlight.unexpectedBracket.foreground":"#bf616a","editorCodeLens.foreground":"#4c566a","editorGroup.background":"#2e3440","editorGroup.border":"#3b425201","editorGroup.dropBackground":"#3b425299","editorGroupHeader.border":"#3b425200","editorGroupHeader.noTabsBackground":"#2e3440","editorGroupHeader.tabsBackground":"#2e3440","editorGroupHeader.tabsBorder":"#3b425200","editorGutter.background":"#2e3440","editorGutter.modifiedBackground":"#ebcb8b","editorGutter.addedBackground":"#a3be8c","editorGutter.deletedBackground":"#bf616a","editorHoverWidget.background":"#3b4252","editorHoverWidget.border":"#3b4252","editorLink.activeForeground":"#88c0d0","editorMarkerNavigation.background":"#5e81acc0","editorMarkerNavigationError.background":"#bf616ac0","editorMarkerNavigationWarning.background":"#ebcb8bc0","editorOverviewRuler.border":"#3b4252","editorOverviewRuler.currentContentForeground":"#3b4252","editorOverviewRuler.incomingContentForeground":"#3b4252","editorOverviewRuler.findMatchForeground":"#88c0d066","editorOverviewRuler.rangeHighlightForeground":"#88c0d066","editorOverviewRuler.selectionHighlightForeground":"#88c0d066","editorOverviewRuler.wordHighlightForeground":"#88c0d066","editorOverviewRuler.wordHighlightStrongForeground":"#88c0d066","editorOverviewRuler.modifiedForeground":"#ebcb8b","editorOverviewRuler.addedForeground":"#a3be8c","editorOverviewRuler.deletedForeground":"#bf616a","editorOverviewRuler.errorForeground":"#bf616a","editorOverviewRuler.warningForeground":"#ebcb8b","editorOverviewRuler.infoForeground":"#81a1c1","editorRuler.foreground":"#434c5e","editorSuggestWidget.background":"#2e3440","editorSuggestWidget.border":"#3b4252","editorSuggestWidget.foreground":"#d8dee9","editorSuggestWidget.focusHighlightForeground":"#88c0d0","editorSuggestWidget.highlightForeground":"#88c0d0","editorSuggestWidget.selectedBackground":"#434c5e","editorSuggestWidget.selectedForeground":"#d8dee9","extensionButton.prominentForeground":"#d8dee9","extensionButton.prominentBackground":"#434c5e","extensionButton.prominentHoverBackground":"#4c566a",errorForeground:"#bf616a","gitDecoration.modifiedResourceForeground":"#ebcb8b","gitDecoration.deletedResourceForeground":"#bf616a","gitDecoration.untrackedResourceForeground":"#a3be8c","gitDecoration.ignoredResourceForeground":"#d8dee966","gitDecoration.conflictingResourceForeground":"#5e81ac","gitDecoration.submoduleResourceForeground":"#8fbcbb","gitDecoration.stageDeletedResourceForeground":"#bf616a","gitDecoration.stageModifiedResourceForeground":"#ebcb8b","input.background":"#3b4252","input.foreground":"#d8dee9","input.placeholderForeground":"#d8dee999","input.border":"#3b4252","inputOption.activeBackground":"#5e81ac","inputOption.activeBorder":"#5e81ac","inputOption.activeForeground":"#eceff4","inputValidation.errorBackground":"#bf616a","inputValidation.errorBorder":"#bf616a","inputValidation.infoBackground":"#81a1c1","inputValidation.infoBorder":"#81a1c1","inputValidation.warningBackground":"#d08770","inputValidation.warningBorder":"#d08770","keybindingLabel.background":"#4c566a","keybindingLabel.border":"#4c566a","keybindingLabel.bottomBorder":"#4c566a","keybindingLabel.foreground":"#d8dee9","list.activeSelectionBackground":"#88c0d0","list.activeSelectionForeground":"#2e3440","list.inactiveSelectionBackground":"#434c5e","list.inactiveSelectionForeground":"#d8dee9","list.inactiveFocusBackground":"#434c5ecc","list.hoverForeground":"#eceff4","list.focusForeground":"#d8dee9","list.focusBackground":"#88c0d099","list.focusHighlightForeground":"#eceff4","list.hoverBackground":"#3b4252","list.dropBackground":"#88c0d099","list.highlightForeground":"#88c0d0","list.errorForeground":"#bf616a","list.warningForeground":"#ebcb8b","merge.currentHeaderBackground":"#81a1c166","merge.currentContentBackground":"#81a1c14d","merge.incomingHeaderBackground":"#8fbcbb66","merge.incomingContentBackground":"#8fbcbb4d","merge.border":"#3b425200","minimap.background":"#2e3440","minimap.errorHighlight":"#bf616acc","minimap.findMatchHighlight":"#88c0d0","minimap.selectionHighlight":"#88c0d0cc","minimap.warningHighlight":"#ebcb8bcc","minimapGutter.addedBackground":"#a3be8c","minimapGutter.deletedBackground":"#bf616a","minimapGutter.modifiedBackground":"#ebcb8b","minimapSlider.activeBackground":"#434c5eaa","minimapSlider.background":"#434c5e99","minimapSlider.hoverBackground":"#434c5eaa","notification.background":"#3b4252","notification.buttonBackground":"#434c5e","notification.buttonForeground":"#d8dee9","notification.buttonHoverBackground":"#4c566a","notification.errorBackground":"#bf616a","notification.errorForeground":"#2e3440","notification.foreground":"#d8dee9","notification.infoBackground":"#88c0d0","notification.infoForeground":"#2e3440","notification.warningBackground":"#ebcb8b","notification.warningForeground":"#2e3440","notificationCenter.border":"#3b425200","notificationCenterHeader.background":"#2e3440","notificationCenterHeader.foreground":"#88c0d0","notificationLink.foreground":"#88c0d0","notifications.background":"#3b4252","notifications.border":"#2e3440","notifications.foreground":"#d8dee9","notificationToast.border":"#3b425200","panel.background":"#2e3440","panel.border":"#3b4252","panelTitle.activeBorder":"#88c0d000","panelTitle.activeForeground":"#88c0d0","panelTitle.inactiveForeground":"#d8dee9","peekView.border":"#4c566a","peekViewEditor.background":"#2e3440","peekViewEditorGutter.background":"#2e3440","peekViewEditor.matchHighlightBackground":"#88c0d04d","peekViewResult.background":"#2e3440","peekViewResult.fileForeground":"#88c0d0","peekViewResult.lineForeground":"#d8dee966","peekViewResult.matchHighlightBackground":"#88c0d0cc","peekViewResult.selectionBackground":"#434c5e","peekViewResult.selectionForeground":"#d8dee9","peekViewTitle.background":"#3b4252","peekViewTitleDescription.foreground":"#d8dee9","peekViewTitleLabel.foreground":"#88c0d0","pickerGroup.border":"#3b4252","pickerGroup.foreground":"#88c0d0","progressBar.background":"#88c0d0","quickInputList.focusBackground":"#88c0d0","quickInputList.focusForeground":"#2e3440","sash.hoverBorder":"#88c0d0","scrollbar.shadow":"#00000066","scrollbarSlider.activeBackground":"#434c5eaa","scrollbarSlider.background":"#434c5e99","scrollbarSlider.hoverBackground":"#434c5eaa","selection.background":"#88c0d099","sideBar.background":"#2e3440","sideBar.foreground":"#d8dee9","sideBar.border":"#3b4252","sideBarSectionHeader.background":"#3b4252","sideBarSectionHeader.foreground":"#d8dee9","sideBarTitle.foreground":"#d8dee9","statusBar.background":"#3b4252","statusBar.debuggingBackground":"#5e81ac","statusBar.debuggingForeground":"#d8dee9","statusBar.noFolderForeground":"#d8dee9","statusBar.noFolderBackground":"#3b4252","statusBar.foreground":"#d8dee9","statusBarItem.activeBackground":"#4c566a","statusBarItem.hoverBackground":"#434c5e","statusBarItem.prominentBackground":"#3b4252","statusBarItem.prominentHoverBackground":"#434c5e","statusBarItem.errorBackground":"#3b4252","statusBarItem.errorForeground":"#bf616a","statusBarItem.warningBackground":"#ebcb8b","statusBarItem.warningForeground":"#2e3440","statusBar.border":"#3b425200","tab.activeBackground":"#3b4252","tab.activeForeground":"#d8dee9","tab.border":"#3b425200","tab.activeBorder":"#88c0d000","tab.unfocusedActiveBorder":"#88c0d000","tab.inactiveBackground":"#2e3440","tab.inactiveForeground":"#d8dee966","tab.unfocusedActiveForeground":"#d8dee999","tab.unfocusedInactiveForeground":"#d8dee966","tab.hoverBackground":"#3b4252cc","tab.unfocusedHoverBackground":"#3b4252b3","tab.hoverBorder":"#88c0d000","tab.unfocusedHoverBorder":"#88c0d000","tab.activeBorderTop":"#88c0d000","tab.unfocusedActiveBorderTop":"#88c0d000","tab.lastPinnedBorder":"#4c566a","terminal.background":"#2e3440","terminal.foreground":"#d8dee9","terminal.ansiBlack":"#3b4252","terminal.ansiRed":"#bf616a","terminal.ansiGreen":"#a3be8c","terminal.ansiYellow":"#ebcb8b","terminal.ansiBlue":"#81a1c1","terminal.ansiMagenta":"#b48ead","terminal.ansiCyan":"#88c0d0","terminal.ansiWhite":"#e5e9f0","terminal.ansiBrightBlack":"#4c566a","terminal.ansiBrightRed":"#bf616a","terminal.ansiBrightGreen":"#a3be8c","terminal.ansiBrightYellow":"#ebcb8b","terminal.ansiBrightBlue":"#81a1c1","terminal.ansiBrightMagenta":"#b48ead","terminal.ansiBrightCyan":"#8fbcbb","terminal.ansiBrightWhite":"#eceff4","terminal.tab.activeBorder":"#88c0d0","textBlockQuote.background":"#3b4252","textBlockQuote.border":"#81a1c1","textCodeBlock.background":"#4c566a","textLink.activeForeground":"#88c0d0","textLink.foreground":"#88c0d0","textPreformat.foreground":"#8fbcbb","textSeparator.foreground":"#eceff4","titleBar.activeBackground":"#2e3440","titleBar.activeForeground":"#d8dee9","titleBar.border":"#2e344000","titleBar.inactiveBackground":"#2e3440","titleBar.inactiveForeground":"#d8dee966","tree.indentGuidesStroke":"#616e88","walkThrough.embeddedEditorBackground":"#2e3440","welcomePage.buttonBackground":"#434c5e","welcomePage.buttonHoverBackground":"#4c566a","widget.shadow":"#00000066"},tokenColors:[{settings:{foreground:"#d8dee9ff",background:"#2e3440ff"}},{scope:"emphasis",settings:{fontStyle:"italic"}},{scope:"strong",settings:{fontStyle:"bold"}},{name:"Comment",scope:"comment",settings:{foreground:"#616E88"}},{name:"Constant Character",scope:"constant.character",settings:{foreground:"#EBCB8B"}},{name:"Constant Character Escape",scope:"constant.character.escape",settings:{foreground:"#EBCB8B"}},{name:"Constant Language",scope:"constant.language",settings:{foreground:"#81A1C1"}},{name:"Constant Numeric",scope:"constant.numeric",settings:{foreground:"#B48EAD"}},{name:"Constant Regexp",scope:"constant.regexp",settings:{foreground:"#EBCB8B"}},{name:"Entity Name Class/Type",scope:["entity.name.class","entity.name.type.class"],settings:{foreground:"#8FBCBB"}},{name:"Entity Name Function",scope:"entity.name.function",settings:{foreground:"#88C0D0"}},{name:"Entity Name Tag",scope:"entity.name.tag",settings:{foreground:"#81A1C1"}},{name:"Entity Other Attribute Name",scope:"entity.other.attribute-name",settings:{foreground:"#8FBCBB"}},{name:"Entity Other Inherited Class",scope:"entity.other.inherited-class",settings:{fontStyle:"bold",foreground:"#8FBCBB"}},{name:"Invalid Deprecated",scope:"invalid.deprecated",settings:{foreground:"#D8DEE9",background:"#EBCB8B"}},{name:"Invalid Illegal",scope:"invalid.illegal",settings:{foreground:"#D8DEE9",background:"#BF616A"}},{name:"Keyword",scope:"keyword",settings:{foreground:"#81A1C1"}},{name:"Keyword Operator",scope:"keyword.operator",settings:{foreground:"#81A1C1"}},{name:"Keyword Other New",scope:"keyword.other.new",settings:{foreground:"#81A1C1"}},{name:"Markup Bold",scope:"markup.bold",settings:{fontStyle:"bold"}},{name:"Markup Changed",scope:"markup.changed",settings:{foreground:"#EBCB8B"}},{name:"Markup Deleted",scope:"markup.deleted",settings:{foreground:"#BF616A"}},{name:"Markup Inserted",scope:"markup.inserted",settings:{foreground:"#A3BE8C"}},{name:"Meta Preprocessor",scope:"meta.preprocessor",settings:{foreground:"#5E81AC"}},{name:"Punctuation",scope:"punctuation",settings:{foreground:"#ECEFF4"}},{name:"Punctuation Definition Parameters",scope:["punctuation.definition.method-parameters","punctuation.definition.function-parameters","punctuation.definition.parameters"],settings:{foreground:"#ECEFF4"}},{name:"Punctuation Definition Tag",scope:"punctuation.definition.tag",settings:{foreground:"#81A1C1"}},{name:"Punctuation Definition Comment",scope:["punctuation.definition.comment","punctuation.end.definition.comment","punctuation.start.definition.comment"],settings:{foreground:"#616E88"}},{name:"Punctuation Section",scope:"punctuation.section",settings:{foreground:"#ECEFF4"}},{name:"Punctuation Section Embedded",scope:["punctuation.section.embedded.begin","punctuation.section.embedded.end"],settings:{foreground:"#81A1C1"}},{name:"Punctuation Terminator",scope:"punctuation.terminator",settings:{foreground:"#81A1C1"}},{name:"Punctuation Variable",scope:"punctuation.definition.variable",settings:{foreground:"#81A1C1"}},{name:"Storage",scope:"storage",settings:{foreground:"#81A1C1"}},{name:"String",scope:"string",settings:{foreground:"#A3BE8C"}},{name:"String Regexp",scope:"string.regexp",settings:{foreground:"#EBCB8B"}},{name:"Support Class",scope:"support.class",settings:{foreground:"#8FBCBB"}},{name:"Support Constant",scope:"support.constant",settings:{foreground:"#81A1C1"}},{name:"Support Function",scope:"support.function",settings:{foreground:"#88C0D0"}},{name:"Support Function Construct",scope:"support.function.construct",settings:{foreground:"#81A1C1"}},{name:"Support Type",scope:"support.type",settings:{foreground:"#8FBCBB"}},{name:"Support Type Exception",scope:"support.type.exception",settings:{foreground:"#8FBCBB"}},{name:"Token Debug",scope:"token.debug-token",settings:{foreground:"#b48ead"}},{name:"Token Error",scope:"token.error-token",settings:{foreground:"#bf616a"}},{name:"Token Info",scope:"token.info-token",settings:{foreground:"#88c0d0"}},{name:"Token Warning",scope:"token.warn-token",settings:{foreground:"#ebcb8b"}},{name:"Variable",scope:"variable.other",settings:{foreground:"#D8DEE9"}},{name:"Variable Language",scope:"variable.language",settings:{foreground:"#81A1C1"}},{name:"Variable Parameter",scope:"variable.parameter",settings:{foreground:"#D8DEE9"}},{name:"[C/CPP] Punctuation Separator Pointer-Access",scope:"punctuation.separator.pointer-access.c",settings:{foreground:"#81A1C1"}},{name:"[C/CPP] Meta Preprocessor Include",scope:["source.c meta.preprocessor.include","source.c string.quoted.other.lt-gt.include"],settings:{foreground:"#8FBCBB"}},{name:"[C/CPP] Conditional Directive",scope:["source.cpp keyword.control.directive.conditional","source.cpp punctuation.definition.directive","source.c keyword.control.directive.conditional","source.c punctuation.definition.directive"],settings:{foreground:"#5E81AC",fontStyle:"bold"}},{name:"[CSS] Constant Other Color RGB Value",scope:"source.css constant.other.color.rgb-value",settings:{foreground:"#B48EAD"}},{name:"[CSS](Function) Meta Property-Value",scope:"source.css meta.property-value",settings:{foreground:"#88C0D0"}},{name:"[CSS] Media Queries",scope:["source.css keyword.control.at-rule.media","source.css keyword.control.at-rule.media punctuation.definition.keyword"],settings:{foreground:"#D08770"}},{name:"[CSS] Punctuation Definition Keyword",scope:"source.css punctuation.definition.keyword",settings:{foreground:"#81A1C1"}},{name:"[CSS] Support Type Property Name",scope:"source.css support.type.property-name",settings:{foreground:"#D8DEE9"}},{name:"[diff] Meta Range Context",scope:"source.diff meta.diff.range.context",settings:{foreground:"#8FBCBB"}},{name:"[diff] Meta Header From-File",scope:"source.diff meta.diff.header.from-file",settings:{foreground:"#8FBCBB"}},{name:"[diff] Punctuation Definition From-File",scope:"source.diff punctuation.definition.from-file",settings:{foreground:"#8FBCBB"}},{name:"[diff] Punctuation Definition Range",scope:"source.diff punctuation.definition.range",settings:{foreground:"#8FBCBB"}},{name:"[diff] Punctuation Definition Separator",scope:"source.diff punctuation.definition.separator",settings:{foreground:"#81A1C1"}},{name:"[Elixir](JakeBecker.elixir-ls) module names",scope:"entity.name.type.module.elixir",settings:{foreground:"#8FBCBB"}},{name:"[Elixir](JakeBecker.elixir-ls) module attributes",scope:"variable.other.readwrite.module.elixir",settings:{foreground:"#D8DEE9",fontStyle:"bold"}},{name:"[Elixir](JakeBecker.elixir-ls) atoms",scope:"constant.other.symbol.elixir",settings:{foreground:"#D8DEE9",fontStyle:"bold"}},{name:"[Elixir](JakeBecker.elixir-ls) modules",scope:"variable.other.constant.elixir",settings:{foreground:"#8FBCBB"}},{name:"[Go] String Format Placeholder",scope:"source.go constant.other.placeholder.go",settings:{foreground:"#EBCB8B"}},{name:"[Java](JavaDoc) Comment Block Documentation HTML Entities",scope:"source.java comment.block.documentation.javadoc punctuation.definition.entity.html",settings:{foreground:"#81A1C1"}},{name:"[Java](JavaDoc) Constant Other",scope:"source.java constant.other",settings:{foreground:"#D8DEE9"}},{name:"[Java](JavaDoc) Keyword Other Documentation",scope:"source.java keyword.other.documentation",settings:{foreground:"#8FBCBB"}},{name:"[Java](JavaDoc) Keyword Other Documentation Author",scope:"source.java keyword.other.documentation.author.javadoc",settings:{foreground:"#8FBCBB"}},{name:"[Java](JavaDoc) Keyword Other Documentation Directive/Custom",scope:["source.java keyword.other.documentation.directive","source.java keyword.other.documentation.custom"],settings:{foreground:"#8FBCBB"}},{name:"[Java](JavaDoc) Keyword Other Documentation See",scope:"source.java keyword.other.documentation.see.javadoc",settings:{foreground:"#8FBCBB"}},{name:"[Java] Meta Method-Call",scope:"source.java meta.method-call meta.method",settings:{foreground:"#88C0D0"}},{name:"[Java](JavaDoc) Meta Tag Template Link",scope:["source.java meta.tag.template.link.javadoc","source.java string.other.link.title.javadoc"],settings:{foreground:"#8FBCBB"}},{name:"[Java](JavaDoc) Meta Tag Template Value",scope:"source.java meta.tag.template.value.javadoc",settings:{foreground:"#88C0D0"}},{name:"[Java](JavaDoc) Punctuation Definition Keyword",scope:"source.java punctuation.definition.keyword.javadoc",settings:{foreground:"#8FBCBB"}},{name:"[Java](JavaDoc) Punctuation Definition Tag",scope:["source.java punctuation.definition.tag.begin.javadoc","source.java punctuation.definition.tag.end.javadoc"],settings:{foreground:"#616E88"}},{name:"[Java] Storage Modifier Import",scope:"source.java storage.modifier.import",settings:{foreground:"#8FBCBB"}},{name:"[Java] Storage Modifier Package",scope:"source.java storage.modifier.package",settings:{foreground:"#8FBCBB"}},{name:"[Java] Storage Type",scope:"source.java storage.type",settings:{foreground:"#8FBCBB"}},{name:"[Java] Storage Type Annotation",scope:"source.java storage.type.annotation",settings:{foreground:"#D08770"}},{name:"[Java] Storage Type Generic",scope:"source.java storage.type.generic",settings:{foreground:"#8FBCBB"}},{name:"[Java] Storage Type Primitive",scope:"source.java storage.type.primitive",settings:{foreground:"#81A1C1"}},{name:"[JavaScript] Decorator",scope:["source.js punctuation.decorator","source.js meta.decorator variable.other.readwrite","source.js meta.decorator entity.name.function"],settings:{foreground:"#D08770"}},{name:"[JavaScript] Meta Object-Literal Key",scope:"source.js meta.object-literal.key",settings:{foreground:"#88C0D0"}},{name:"[JavaScript](JSDoc) Storage Type Class",scope:"source.js storage.type.class.jsdoc",settings:{foreground:"#8FBCBB"}},{name:"[JavaScript] String Template Literals Punctuation",scope:["source.js string.quoted.template punctuation.quasi.element.begin","source.js string.quoted.template punctuation.quasi.element.end","source.js string.template punctuation.definition.template-expression"],settings:{foreground:"#81A1C1"}},{name:"[JavaScript] Interpolated String Template Punctuation Functions",scope:"source.js string.quoted.template meta.method-call.with-arguments",settings:{foreground:"#ECEFF4"}},{name:"[JavaScript] String Template Literal Variable",scope:["source.js string.template meta.template.expression support.variable.property","source.js string.template meta.template.expression variable.other.object"],settings:{foreground:"#D8DEE9"}},{name:"[JavaScript] Support Type Primitive",scope:"source.js support.type.primitive",settings:{foreground:"#81A1C1"}},{name:"[JavaScript] Variable Other Object",scope:"source.js variable.other.object",settings:{foreground:"#D8DEE9"}},{name:"[JavaScript] Variable Other Read-Write Alias",scope:"source.js variable.other.readwrite.alias",settings:{foreground:"#8FBCBB"}},{name:"[JavaScript] Parentheses in Template Strings",scope:["source.js meta.embedded.line meta.brace.square","source.js meta.embedded.line meta.brace.round","source.js string.quoted.template meta.brace.square","source.js string.quoted.template meta.brace.round"],settings:{foreground:"#ECEFF4"}},{name:"[HTML] Constant Character Entity",scope:"text.html.basic constant.character.entity.html",settings:{foreground:"#EBCB8B"}},{name:"[HTML] Constant Other Inline-Data",scope:"text.html.basic constant.other.inline-data",settings:{foreground:"#D08770",fontStyle:"italic"}},{name:"[HTML] Meta Tag SGML Doctype",scope:"text.html.basic meta.tag.sgml.doctype",settings:{foreground:"#5E81AC"}},{name:"[HTML] Punctuation Definition Entity",scope:"text.html.basic punctuation.definition.entity",settings:{foreground:"#81A1C1"}},{name:"[INI] Entity Name Section Group-Title",scope:"source.properties entity.name.section.group-title.ini",settings:{foreground:"#88C0D0"}},{name:"[INI] Punctuation Separator Key-Value",scope:"source.properties punctuation.separator.key-value.ini",settings:{foreground:"#81A1C1"}},{name:"[Markdown] Markup Fenced Code Block",scope:["text.html.markdown markup.fenced_code.block","text.html.markdown markup.fenced_code.block punctuation.definition"],settings:{foreground:"#8FBCBB"}},{name:"[Markdown] Markup Heading",scope:"markup.heading",settings:{foreground:"#88C0D0"}},{name:"[Markdown] Markup Inline",scope:["text.html.markdown markup.inline.raw","text.html.markdown markup.inline.raw punctuation.definition.raw"],settings:{foreground:"#8FBCBB"}},{name:"[Markdown] Markup Italic",scope:"text.html.markdown markup.italic",settings:{fontStyle:"italic"}},{name:"[Markdown] Markup Link",scope:"text.html.markdown markup.underline.link",settings:{fontStyle:"underline"}},{name:"[Markdown] Markup List Numbered/Unnumbered",scope:"text.html.markdown beginning.punctuation.definition.list",settings:{foreground:"#81A1C1"}},{name:"[Markdown] Markup Quote Punctuation Definition",scope:"text.html.markdown beginning.punctuation.definition.quote",settings:{foreground:"#8FBCBB"}},{name:"[Markdown] Markup Quote Punctuation Definition",scope:"text.html.markdown markup.quote",settings:{foreground:"#616E88"}},{name:"[Markdown] Markup Math Constant",scope:"text.html.markdown constant.character.math.tex",settings:{foreground:"#81A1C1"}},{name:"[Markdown] Markup Math Definition Marker",scope:["text.html.markdown punctuation.definition.math.begin","text.html.markdown punctuation.definition.math.end"],settings:{foreground:"#5E81AC"}},{name:"[Markdown] Markup Math Function Definition Marker",scope:"text.html.markdown punctuation.definition.function.math.tex",settings:{foreground:"#88C0D0"}},{name:"[Markdown] Markup Math Operator",scope:"text.html.markdown punctuation.math.operator.latex",settings:{foreground:"#81A1C1"}},{name:"[Markdown] Punctuation Definition Heading",scope:"text.html.markdown punctuation.definition.heading",settings:{foreground:"#81A1C1"}},{name:"[Markdown] Punctuation Definition Constant/String",scope:["text.html.markdown punctuation.definition.constant","text.html.markdown punctuation.definition.string"],settings:{foreground:"#81A1C1"}},{name:"[Markdown] String Other Link Description/Title",scope:["text.html.markdown constant.other.reference.link","text.html.markdown string.other.link.description","text.html.markdown string.other.link.title"],settings:{foreground:"#88C0D0"}},{name:"[Perl] Perl Sigils",scope:"source.perl punctuation.definition.variable",settings:{foreground:"#D8DEE9"}},{name:"[PHP] Meta Function-Call Object",scope:["source.php meta.function-call","source.php meta.function-call.object"],settings:{foreground:"#88C0D0"}},{name:"[Python] Decorator",scope:["source.python entity.name.function.decorator","source.python meta.function.decorator support.type"],settings:{foreground:"#D08770"}},{name:"[Python] Function Call",scope:"source.python meta.function-call.generic",settings:{foreground:"#88C0D0"}},{name:"[Python] Support Type",scope:"source.python support.type",settings:{foreground:"#88C0D0"}},{name:"[Python] Function Parameter",scope:["source.python variable.parameter.function.language"],settings:{foreground:"#D8DEE9"}},{name:"[Python] Function Parameter Special",scope:["source.python meta.function.parameters variable.parameter.function.language.special.self"],settings:{foreground:"#81A1C1"}},{name:"[Rust] Entity types",scope:"source.rust entity.name.type",settings:{foreground:"#8FBCBB"}},{name:"[Rust] Macro",scope:"source.rust meta.macro entity.name.function",settings:{fontStyle:"bold",foreground:"#88C0D0"}},{name:"[Rust] Attributes",scope:["source.rust meta.attribute","source.rust meta.attribute punctuation","source.rust meta.attribute keyword.operator"],settings:{foreground:"#5E81AC"}},{name:"[Rust] Traits",scope:"source.rust entity.name.type.trait",settings:{fontStyle:"bold"}},{name:"[Rust] Interpolation Bracket Curly",scope:"source.rust punctuation.definition.interpolation",settings:{foreground:"#EBCB8B"}},{name:"[SCSS] Punctuation Definition Interpolation Bracket Curly",scope:["source.css.scss punctuation.definition.interpolation.begin.bracket.curly","source.css.scss punctuation.definition.interpolation.end.bracket.curly"],settings:{foreground:"#81A1C1"}},{name:"[SCSS] Variable Interpolation",scope:"source.css.scss variable.interpolation",settings:{foreground:"#D8DEE9",fontStyle:"italic"}},{name:"[TypeScript] Decorators",scope:["source.ts punctuation.decorator","source.ts meta.decorator variable.other.readwrite","source.ts meta.decorator entity.name.function","source.tsx punctuation.decorator","source.tsx meta.decorator variable.other.readwrite","source.tsx meta.decorator entity.name.function"],settings:{foreground:"#D08770"}},{name:"[TypeScript] Object-literal keys",scope:["source.ts meta.object-literal.key","source.tsx meta.object-literal.key"],settings:{foreground:"#D8DEE9"}},{name:"[TypeScript] Object-literal functions",scope:["source.ts meta.object-literal.key entity.name.function","source.tsx meta.object-literal.key entity.name.function"],settings:{foreground:"#88C0D0"}},{name:"[TypeScript] Type/Class",scope:["source.ts support.class","source.ts support.type","source.ts entity.name.type","source.ts entity.name.class","source.tsx support.class","source.tsx support.type","source.tsx entity.name.type","source.tsx entity.name.class"],settings:{foreground:"#8FBCBB"}},{name:"[TypeScript] Static Class Support",scope:["source.ts support.constant.math","source.ts support.constant.dom","source.ts support.constant.json","source.tsx support.constant.math","source.tsx support.constant.dom","source.tsx support.constant.json"],settings:{foreground:"#8FBCBB"}},{name:"[TypeScript] Variables",scope:["source.ts support.variable","source.tsx support.variable"],settings:{foreground:"#D8DEE9"}},{name:"[TypeScript] Parentheses in Template Strings",scope:["source.ts meta.embedded.line meta.brace.square","source.ts meta.embedded.line meta.brace.round","source.tsx meta.embedded.line meta.brace.square","source.tsx meta.embedded.line meta.brace.round"],settings:{foreground:"#ECEFF4"}},{name:"[XML] Entity Name Tag Namespace",scope:"text.xml entity.name.tag.namespace",settings:{foreground:"#8FBCBB"}},{name:"[XML] Keyword Other Doctype",scope:"text.xml keyword.other.doctype",settings:{foreground:"#5E81AC"}},{name:"[XML] Meta Tag Preprocessor",scope:"text.xml meta.tag.preprocessor entity.name.tag",settings:{foreground:"#5E81AC"}},{name:"[XML] Entity Name Tag Namespace",scope:["text.xml string.unquoted.cdata","text.xml string.unquoted.cdata punctuation.definition.string"],settings:{foreground:"#D08770",fontStyle:"italic"}},{name:"[YAML] Entity Name Tag",scope:"source.yaml entity.name.tag",settings:{foreground:"#8FBCBB"}}]},autoImport:!0,showCopyButton:!0,enableSpa:!0,skipLanguages:[],filepath:"/Users/targeral/github/targeral-modern-js/website/module-tools/docs/en/guide/advance/asset.mdx"},E=void 0,y=[{id:"default-behavior",text:"Default behavior",depth:2},{id:"setting-cdn-prefix",text:"Setting CDN Prefix",depth:2},{id:"svgr",text:"SVGR",depth:2}],h="Handle static resource files";function i(s){const e=Object.assign({h1:"h1",a:"a",p:"p",code:"code",h2:"h2",ul:"ul",li:"li",strong:"strong"},s.components);return n||c("CH",!1),n.CodeSlot||c("CH.CodeSlot",!0),n.Spotlight||c("CH.Spotlight",!0),t(r,{children:[t(e.h1,{id:"handle-static-resource-files",children:[o(e.a,{className:"header-anchor","aria-hidden":"true",href:"#handle-static-resource-files",children:"#"}),"Handle static resource files"]}),`
2
- `,t(e.p,{children:["The module project will handle static resources used in the code. If configuration is required, then the ",o(e.a,{href:"/en/api/build-config.html#asset",children:o(e.code,{children:"buildConfig.asset"})})," API can be used."]}),`
3
- `,t(e.h2,{id:"default-behavior",children:[o(e.a,{className:"header-anchor","aria-hidden":"true",href:"#default-behavior",children:"#"}),"Default behavior"]}),`
4
- `,o(e.p,{children:"By default, module projects are processed for the following static resources:"}),`
5
- `,t(e.ul,{children:[`
6
- `,t(e.li,{children:[o(e.code,{children:"'.svg'"}),"\u3001",o(e.code,{children:"'.png'"}),"\u3001",o(e.code,{children:"'.jpg'"}),"\u3001",o(e.code,{children:"'.jpeg'"}),"\u3001",o(e.code,{children:"'.gif'"}),"\u3001",o(e.code,{children:"'.webp'"})]}),`
7
- `,t(e.li,{children:[o(e.code,{children:"'.ttf'"}),"\u3001",o(e.code,{children:"'.otf'"}),"\u3001",o(e.code,{children:"'.woff'"}),"\u3001",o(e.code,{children:"'.woff2'"}),"\u3001",o(e.code,{children:"'.eot'"})]}),`
8
- `,t(e.li,{children:[o(e.code,{children:"'.mp3'"}),"\u3001",o(e.code,{children:"'.mp4'"}),"\u3001",o(e.code,{children:"'.webm'"}),"\u3001",o(e.code,{children:"'.ogg'"}),"\u3001",o(e.code,{children:"'.wav'"}),"\u3001",o(e.code,{children:"'.flac'"}),"\u3001",o(e.code,{children:"'.aac'"}),"\u3001",o(e.code,{children:"'.mov'"})]}),`
9
- `]}),`
10
- `,o(e.p,{children:"For the handling of static files, the module project currently supports the following functions."}),`
11
- `,t(e.ul,{children:[`
12
- `,t(e.li,{children:["Set the static resource path to ",o(e.code,{children:". /assets"}),"."]}),`
13
- `,t(e.li,{children:["For files over ",o(e.strong,{children:"10kb"})," they are inlined into the code."]}),`
14
- `,t(e.li,{children:["Use ",o(e.a,{href:"https://react-svgr.com/",target:"_blank",rel:"nofollow",children:"SVGR"})," for files with the ",o(e.code,{children:".svg"})," suffix."]}),`
15
- `]}),`
16
- `,o(e.p,{children:"Let us look at the following example:"}),`
17
- `,t(n.Spotlight,{codeConfig:a,editorSteps:[{northPanel:{tabs:["./src/asset.ts"],active:"./src/asset.ts",heightRatio:1},files:[{name:"./src/asset.ts",focus:"",code:{lines:[{tokens:[{content:"import",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"img",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"from",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:"./bg.png",props:{style:{color:"#A3BE8C"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:"//...",props:{style:{color:"#616E88"}}}]}],lang:"ts"},annotations:[]}]},{northPanel:{tabs:["./src/asset.ts"],active:"./src/asset.ts",heightRatio:1},files:[{name:"./src/asset.ts",focus:"",code:{lines:[{tokens:[{content:"import",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"img",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"from",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:"./bg.png",props:{style:{color:"#A3BE8C"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:"//...",props:{style:{color:"#616E88"}}}]}],lang:"ts"},annotations:[]}],southPanel:void 0},{northPanel:{tabs:["./src/asset.ts",""],active:"",heightRatio:.5},files:[{name:"./src/asset.ts",focus:"",code:{lines:[{tokens:[{content:"import",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"img",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"from",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:"./bg.png",props:{style:{color:"#A3BE8C"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:"//...",props:{style:{color:"#616E88"}}}]}],lang:"ts"},annotations:[]},{name:"",focus:"",code:{lines:[{tokens:[{content:"./dist",props:{style:{color:"#D8DEE9FF"}}}]},{tokens:[{content:"\u2514\u2500\u2500 asset.js",props:{style:{color:"#D8DEE9FF"}}}]}],lang:"bash"},annotations:[]},{name:"./dist/asset.js",focus:"",code:{lines:[{tokens:[{content:"var",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"bg_default",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"=",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:"data:image/png;base64,",props:{style:{color:"#A3BE8C"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:"console",props:{style:{color:"#D8DEE9"}}},{content:".",props:{style:{color:"#ECEFF4"}}},{content:"info",props:{style:{color:"#88C0D0"}}},{content:"(",props:{style:{color:"#D8DEE9FF"}}},{content:"bg_default",props:{style:{color:"#D8DEE9"}}},{content:")",props:{style:{color:"#D8DEE9FF"}}},{content:";",props:{style:{color:"#81A1C1"}}}]}],lang:"js"},annotations:[]}],southPanel:{tabs:["./dist/asset.js"],active:"./dist/asset.js",heightRatio:.5}},{northPanel:{tabs:["./src/asset.ts",""],active:"",heightRatio:.6},files:[{name:"./src/asset.ts",focus:"",code:{lines:[{tokens:[{content:"import",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"img",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"from",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:"./bg.png",props:{style:{color:"#A3BE8C"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:"//...",props:{style:{color:"#616E88"}}}]}],lang:"ts"},annotations:[]},{name:"",focus:"",code:{lines:[{tokens:[{content:"./dist",props:{style:{color:"#D8DEE9FF"}}}]},{tokens:[{content:"\u251C\u2500\u2500 asset.js",props:{style:{color:"#D8DEE9FF"}}}]},{tokens:[{content:"\u2514\u2500\u2500 assets",props:{style:{color:"#D8DEE9FF"}}}]},{tokens:[{content:" \u2514\u2500\u2500 bg.13e2aba2.png",props:{style:{color:"#D8DEE9FF"}}}]}],lang:"bash"},annotations:[]},{name:"./dist/asset.js",focus:"",code:{lines:[{tokens:[{content:"var",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"bg_default",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"=",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:"assets/bg.13e2aba2.png",props:{style:{color:"#A3BE8C"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:"console",props:{style:{color:"#D8DEE9"}}},{content:".",props:{style:{color:"#ECEFF4"}}},{content:"info",props:{style:{color:"#88C0D0"}}},{content:"(",props:{style:{color:"#D8DEE9FF"}}},{content:"bg_default",props:{style:{color:"#D8DEE9"}}},{content:")",props:{style:{color:"#D8DEE9FF"}}},{content:";",props:{style:{color:"#81A1C1"}}}]}],lang:"js"},annotations:[]}],southPanel:{tabs:["./dist/asset.js"],active:"./dist/asset.js",heightRatio:.4}}],children:[o(r,{children:o(n.CodeSlot,{})}),t(r,{children:[o(e.p,{children:"Project source code."}),o(n.CodeSlot,{})]}),t(r,{children:[t(e.p,{children:["If the size of ",o(e.code,{children:"bg.png"})," is less than 10 kb, then the product directory structure and product content are."]}),o(n.CodeSlot,{})]}),t(r,{children:[t(e.p,{children:["If the size of ",o(e.code,{children:"bg.png"})," is larger than 10 kb, then the product directory structure and product content are."]}),o(n.CodeSlot,{})]})]}),`
18
- `,o(e.p,{children:"When wanting to modify the default behavior, the following API can be used:"}),`
19
- `,t(e.ul,{children:[`
20
- `,t(e.li,{children:[o(e.code,{children:"asset.path"}),": modify the output path of the static resource file."]}),`
21
- `,t(e.li,{children:[o(e.code,{children:"asset.limit"}),": modify the threshold value for inline static resource files."]}),`
22
- `]}),`
23
- `,t(e.h2,{id:"setting-cdn-prefix",children:[o(e.a,{className:"header-anchor","aria-hidden":"true",href:"#setting-cdn-prefix",children:"#"}),"Setting CDN Prefix"]}),`
24
- `,o(e.p,{children:"If the project is running in a browser environment, we may need to host static resources to a CDN and then use them in the production environment."}),`
25
- `,o(e.p,{children:"Then we need to add the CDN base path in front of the path to the static resource file in the default generated build product. Again, see an example:"}),`
26
- `,t(n.Spotlight,{codeConfig:a,editorSteps:[{northPanel:{tabs:["./src/asset.ts"],active:"./src/asset.ts",heightRatio:1},files:[{name:"./src/asset.ts",focus:"",code:{lines:[{tokens:[{content:"import",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"img",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"from",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:"./bg.png",props:{style:{color:"#A3BE8C"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:"//...",props:{style:{color:"#616E88"}}}]}],lang:"ts"},annotations:[]}]},{northPanel:{tabs:["./src/asset.ts"],active:"./src/asset.ts",heightRatio:1},files:[{name:"./src/asset.ts",focus:"",code:{lines:[{tokens:[{content:"import",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"img",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"from",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:"./bg.png",props:{style:{color:"#A3BE8C"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:"//...",props:{style:{color:"#616E88"}}}]}],lang:"ts"},annotations:[]}],southPanel:void 0},{northPanel:{tabs:["./src/asset.ts","./modern.config.ts"],active:"./modern.config.ts",heightRatio:1},files:[{name:"./src/asset.ts",focus:"",code:{lines:[{tokens:[{content:"import",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"img",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"from",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:"./bg.png",props:{style:{color:"#A3BE8C"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:"//...",props:{style:{color:"#616E88"}}}]}],lang:"ts"},annotations:[]},{name:"./modern.config.ts",focus:"",code:{lines:[{tokens:[{content:"export",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"default",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"defineConfig",props:{style:{color:"#88C0D0"}}},{content:"(",props:{style:{color:"#D8DEE9FF"}}},{content:"{",props:{style:{color:"#ECEFF4"}}}]},{tokens:[{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"buildConfig",props:{style:{color:"#D8DEE9"}}},{content:":",props:{style:{color:"#ECEFF4"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"{",props:{style:{color:"#ECEFF4"}}}]},{tokens:[{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"format",props:{style:{color:"#D8DEE9"}}},{content:":",props:{style:{color:"#ECEFF4"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:"umd",props:{style:{color:"#A3BE8C"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:",",props:{style:{color:"#ECEFF4"}}}]},{tokens:[{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"asset",props:{style:{color:"#D8DEE9"}}},{content:":",props:{style:{color:"#ECEFF4"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"{",props:{style:{color:"#ECEFF4"}}}]},{tokens:[{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"publicPath",props:{style:{color:"#D8DEE9"}}},{content:":",props:{style:{color:"#ECEFF4"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:"https://cdn/",props:{style:{color:"#A3BE8C"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:",",props:{style:{color:"#ECEFF4"}}}]},{tokens:[{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"},",props:{style:{color:"#ECEFF4"}}}]},{tokens:[{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"},",props:{style:{color:"#ECEFF4"}}}]},{tokens:[{content:"}",props:{style:{color:"#ECEFF4"}}},{content:")",props:{style:{color:"#D8DEE9FF"}}},{content:";",props:{style:{color:"#81A1C1"}}}]}],lang:"ts"},annotations:[]}],southPanel:void 0},{northPanel:{tabs:["./src/asset.ts","./dist/asset.js"],active:"./dist/asset.js",heightRatio:1},files:[{name:"./src/asset.ts",focus:"",code:{lines:[{tokens:[{content:"import",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"img",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"from",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:"./bg.png",props:{style:{color:"#A3BE8C"}}},{content:"'",props:{style:{color:"#ECEFF4"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:"//...",props:{style:{color:"#616E88"}}}]}],lang:"ts"},annotations:[]},{name:"./dist/asset.js",focus:"7:7",code:{lines:[{tokens:[{content:"(",props:{style:{color:"#D8DEE9FF"}}},{content:"function",props:{style:{color:"#81A1C1"}}},{content:"(",props:{style:{color:"#ECEFF4"}}},{content:"global",props:{style:{color:"#D8DEE9"}}},{content:",",props:{style:{color:"#ECEFF4"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"factory",props:{style:{color:"#D8DEE9"}}},{content:")",props:{style:{color:"#ECEFF4"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"{",props:{style:{color:"#ECEFF4"}}}]},{tokens:[{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"if",props:{style:{color:"#81A1C1"}}},{content:" (",props:{style:{color:"#D8DEE9FF"}}},{content:"typeof",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"module",props:{style:{color:"#8FBCBB"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"===",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:"object",props:{style:{color:"#A3BE8C"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"&&",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"typeof",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"module",props:{style:{color:"#8FBCBB"}}},{content:".",props:{style:{color:"#ECEFF4"}}},{content:"exports",props:{style:{color:"#8FBCBB"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"===",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:"object",props:{style:{color:"#A3BE8C"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:") ",props:{style:{color:"#D8DEE9FF"}}},{content:"factory",props:{style:{color:"#88C0D0"}}},{content:"()",props:{style:{color:"#D8DEE9FF"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"else",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"if",props:{style:{color:"#81A1C1"}}},{content:" (",props:{style:{color:"#D8DEE9FF"}}},{content:"typeof",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"define",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"===",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:"function",props:{style:{color:"#A3BE8C"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"&&",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"define",props:{style:{color:"#D8DEE9"}}},{content:".",props:{style:{color:"#ECEFF4"}}},{content:"amd",props:{style:{color:"#D8DEE9"}}},{content:") ",props:{style:{color:"#D8DEE9FF"}}},{content:"define",props:{style:{color:"#88C0D0"}}},{content:"([]",props:{style:{color:"#D8DEE9FF"}}},{content:",",props:{style:{color:"#ECEFF4"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"factory",props:{style:{color:"#D8DEE9"}}},{content:")",props:{style:{color:"#D8DEE9FF"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"else",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"if",props:{style:{color:"#81A1C1"}}},{content:" (",props:{style:{color:"#D8DEE9FF"}}},{content:"global",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"=",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"typeof",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"globalThis",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"!==",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:"undefined",props:{style:{color:"#A3BE8C"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"?",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"globalThis",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:":",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"global",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"||",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"self",props:{style:{color:"#D8DEE9"}}},{content:") ",props:{style:{color:"#D8DEE9FF"}}},{content:"factory",props:{style:{color:"#88C0D0"}}},{content:"()",props:{style:{color:"#D8DEE9FF"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:"}",props:{style:{color:"#ECEFF4"}}},{content:")(",props:{style:{color:"#D8DEE9FF"}}},{content:"this",props:{style:{color:"#81A1C1"}}},{content:",",props:{style:{color:"#ECEFF4"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"function",props:{style:{color:"#81A1C1"}}},{content:"()",props:{style:{color:"#ECEFF4"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"{",props:{style:{color:"#ECEFF4"}}}]},{tokens:[{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:"use strict",props:{style:{color:"#A3BE8C"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"var",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"bg_default",props:{style:{color:"#D8DEE9"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"=",props:{style:{color:"#81A1C1"}}},{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:"http://cdn/assets/bg.13e2aba2.png",props:{style:{color:"#A3BE8C"}}},{content:'"',props:{style:{color:"#ECEFF4"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:" ",props:{style:{color:"#ECEFF4"}}},{content:"// src/asset.tsx",props:{style:{color:"#616E88"}}}]},{tokens:[{content:" ",props:{style:{color:"#D8DEE9FF"}}},{content:"console",props:{style:{color:"#D8DEE9"}}},{content:".",props:{style:{color:"#ECEFF4"}}},{content:"info",props:{style:{color:"#88C0D0"}}},{content:"(",props:{style:{color:"#D8DEE9FF"}}},{content:"bg_default",props:{style:{color:"#D8DEE9"}}},{content:")",props:{style:{color:"#D8DEE9FF"}}},{content:";",props:{style:{color:"#81A1C1"}}}]},{tokens:[{content:"}",props:{style:{color:"#ECEFF4"}}},{content:")",props:{style:{color:"#D8DEE9FF"}}},{content:";",props:{style:{color:"#81A1C1"}}}]}],lang:"js"},annotations:[]}],southPanel:void 0}],children:[o(r,{children:o(n.CodeSlot,{})}),t(r,{children:[o(e.p,{children:"Project source code."}),o(n.CodeSlot,{})]}),t(r,{children:[t(e.p,{children:[o(e.code,{children:"modern.config"})," config file\u3002"]}),o(n.CodeSlot,{})]}),t(r,{children:[t(e.p,{children:["If the size of ",o(e.code,{children:"bg.png"})," is larger than 10 kb, then the product content will be."]}),o(n.CodeSlot,{})]})]}),`
27
- `,t(e.h2,{id:"svgr",children:[o(e.a,{className:"header-anchor","aria-hidden":"true",href:"#svgr",children:"#"}),"SVGR"]}),`
28
- `,o(e.p,{children:"WIP"})]})}function b(s={}){const{wrapper:e}=s.components||{};return e?o(e,Object.assign({},s,{children:o(i,s)})):i(s)}function c(s,e){throw new Error("Expected "+(e?"component":"object")+" `"+s+"` to be defined: you likely forgot to import, pass, or provide it.")}const F="2022/12/16 16:18:07",D=`# Handle static resource files
29
-
30
- The module project will handle static resources used in the code. If configuration is required, then the [\`buildConfig.asset\`](/en/api/build-config#asset) API can be used.
31
-
32
- ## Default behavior
33
-
34
- By default, module projects are processed for the following static resources:
35
-
36
- * \`'.svg'\`\u3001\`'.png'\`\u3001\`'.jpg'\`\u3001\`'.jpeg'\`\u3001\`'.gif'\`\u3001\`'.webp'\`
37
- * \`'.ttf'\`\u3001\`'.otf'\`\u3001\`'.woff'\`\u3001\`'.woff2'\`\u3001\`'.eot'\`
38
- * \`'.mp3'\`\u3001\`'.mp4'\`\u3001\`'.webm'\`\u3001\`'.ogg'\`\u3001\`'.wav'\`\u3001\`'.flac'\`\u3001\`'.aac'\`\u3001\`'.mov'\`
39
-
40
- For the handling of static files, the module project currently supports the following functions.
41
-
42
- * Set the static resource path to \`. /assets\`.
43
- * For files over **10kb** they are inlined into the code.
44
- * Use [SVGR](https://react-svgr.com/) for files with the \`.svg\` suffix.
45
-
46
- Let us look at the following example:
47
-
48
- <CH.Spotlight>
49
-
50
- \`\`\` ts ./src/asset.ts
51
- import img from './bg.png';
52
- //...
53
- \`\`\`
54
-
55
- ---
56
- Project source code.
57
-
58
- \`\`\` ts ./src/asset.ts
59
- import img from './bg.png';
60
- //...
61
- \`\`\`
62
- ---
63
- If the size of \`bg.png\` is less than 10 kb, then the product directory structure and product content are.
64
-
65
- <CH.Code>
66
-
67
- \`\`\` bash
68
- ./dist
69
- \u2514\u2500\u2500 asset.js
70
- \`\`\`
71
- ---
72
-
73
- \`\`\` js ./dist/asset.js
74
- var bg_default = "data:image/png;base64,";
75
- console.info(bg_default);
76
- \`\`\`
77
- </CH.Code>
78
- ---
79
-
80
- If the size of \`bg.png\` is larger than 10 kb, then the product directory structure and product content are.
81
-
82
- <CH.Code>
83
-
84
- \`\`\` bash
85
- ./dist
86
- \u251C\u2500\u2500 asset.js
87
- \u2514\u2500\u2500 assets
88
- \u2514\u2500\u2500 bg.13e2aba2.png
89
- \`\`\`
90
- ---
91
-
92
- \`\`\` js ./dist/asset.js
93
- var bg_default = "assets/bg.13e2aba2.png";
94
- console.info(bg_default);
95
- \`\`\`
96
- </CH.Code>
97
-
98
- </CH.Spotlight>
99
-
100
- When wanting to modify the default behavior, the following API can be used:
101
-
102
- * \`asset.path\`: modify the output path of the static resource file.
103
- * \`asset.limit\`: modify the threshold value for inline static resource files.
104
-
105
- ## Setting CDN Prefix
106
-
107
- If the project is running in a browser environment, we may need to host static resources to a CDN and then use them in the production environment.
108
-
109
- Then we need to add the CDN base path in front of the path to the static resource file in the default generated build product. Again, see an example:
110
-
111
- <CH.Spotlight>
112
-
113
- \`\`\` ts ./src/asset.ts
114
- import img from './bg.png';
115
- //...
116
- \`\`\`
117
-
118
- ---
119
- Project source code.
120
-
121
- \`\`\` ts ./src/asset.ts
122
- \`\`\`
123
- ---
124
-
125
- \`modern.config\` config file\u3002
126
-
127
- \`\`\` ts ./modern.config.ts
128
- export default defineConfig({
129
- buildConfig: {
130
- format: 'umd',
131
- asset: {
132
- publicPath: 'https://cdn/',
133
- },
134
- },
135
- });
136
- \`\`\`
137
-
138
- ---
139
-
140
- If the size of \`bg.png\` is larger than 10 kb, then the product content will be.
141
-
142
- \`\`\` js ./dist/asset.js focus=7:7
143
- (function(global, factory) {
144
- if (typeof module === "object" && typeof module.exports === "object") factory();
145
- else if (typeof define === "function" && define.amd) define([], factory);
146
- else if (global = typeof globalThis !== "undefined" ? globalThis : global || self) factory();
147
- })(this, function() {
148
- "use strict";
149
- var bg_default = "http://cdn/assets/bg.13e2aba2.png";
150
- // src/asset.tsx
151
- console.info(bg_default);
152
- });
153
- \`\`\`
154
-
155
- </CH.Spotlight>
156
-
157
- ## SVGR
158
-
159
- WIP
160
- `;export{n as CH,a as chCodeConfig,D as content,b as default,E as frontmatter,F as lastUpdatedTime,h as title,y as toc};