@modern-js/module-tools-docs 2.25.2-beta.0 → 2.26.0

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 (211) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/docs/en/api/config/build-config.md +10 -10
  3. package/docs/en/api/config/build-preset.mdx +4 -4
  4. package/docs/en/guide/advance/asset.mdx +2 -2
  5. package/docs/en/guide/advance/build-umd.mdx +9 -9
  6. package/docs/en/guide/advance/copy.md +1 -1
  7. package/docs/en/guide/advance/external-dependency.mdx +2 -2
  8. package/docs/en/guide/advance/in-depth-about-build.md +11 -11
  9. package/docs/en/guide/advance/in-depth-about-dev-command.md +1 -1
  10. package/docs/en/guide/basic/before-getting-started.md +1 -1
  11. package/docs/en/guide/basic/command-preview.md +5 -5
  12. package/docs/en/guide/basic/modify-output-product.md +18 -18
  13. package/docs/en/guide/basic/using-storybook.mdx +1 -1
  14. package/docs/en/guide/best-practices/components.mdx +10 -10
  15. package/docs/en/guide/faq/build.mdx +1 -1
  16. package/docs/en/guide/intro/welcome.md +2 -2
  17. package/docs/en/plugins/guide/getting-started.mdx +1 -1
  18. package/docs/en/plugins/guide/plugin-object.mdx +2 -2
  19. package/docs/en/plugins/guide/setup-function.mdx +1 -1
  20. package/docs/zh/api/config/build-config.md +1 -1
  21. package/docs/zh/guide/faq/build.mdx +1 -1
  22. package/package.json +3 -3
  23. package/doc_build/api/config/build-config.html +0 -522
  24. package/doc_build/api/config/build-preset.html +0 -71
  25. package/doc_build/api/config/design-system.html +0 -113
  26. package/doc_build/api/config/dev.html +0 -40
  27. package/doc_build/api/config/plugins.html +0 -31
  28. package/doc_build/api/config/testing.html +0 -31
  29. package/doc_build/api/index.html +0 -11
  30. package/doc_build/api/plugin-api/plugin-hooks.html +0 -122
  31. package/doc_build/components/faq-build-exception.html +0 -11
  32. package/doc_build/components/faq-build-other.html +0 -11
  33. package/doc_build/components/faq-build-product.html +0 -11
  34. package/doc_build/components/faq-storybook.html +0 -11
  35. package/doc_build/components/faq-test.html +0 -11
  36. package/doc_build/en/api/config/build-config.html +0 -443
  37. package/doc_build/en/api/config/build-preset.html +0 -71
  38. package/doc_build/en/api/config/design-system.html +0 -127
  39. package/doc_build/en/api/config/dev.html +0 -40
  40. package/doc_build/en/api/config/plugins.html +0 -31
  41. package/doc_build/en/api/config/testing.html +0 -31
  42. package/doc_build/en/api/index.html +0 -11
  43. package/doc_build/en/api/plugin-api/plugin-hooks.html +0 -122
  44. package/doc_build/en/components/faq-build-exception.html +0 -11
  45. package/doc_build/en/components/faq-build-other.html +0 -11
  46. package/doc_build/en/components/faq-build-product.html +0 -11
  47. package/doc_build/en/components/faq-storybook.html +0 -11
  48. package/doc_build/en/components/faq-test.html +0 -11
  49. package/doc_build/en/guide/advance/asset.html +0 -31
  50. package/doc_build/en/guide/advance/build-umd.html +0 -42
  51. package/doc_build/en/guide/advance/copy.html +0 -52
  52. package/doc_build/en/guide/advance/external-dependency.html +0 -32
  53. package/doc_build/en/guide/advance/in-depth-about-build.html +0 -123
  54. package/doc_build/en/guide/advance/in-depth-about-dev-command.html +0 -32
  55. package/doc_build/en/guide/advance/theme-config.html +0 -39
  56. package/doc_build/en/guide/basic/before-getting-started.html +0 -97
  57. package/doc_build/en/guide/basic/command-preview.html +0 -73
  58. package/doc_build/en/guide/basic/modify-output-product.html +0 -113
  59. package/doc_build/en/guide/basic/publish-your-project.html +0 -60
  60. package/doc_build/en/guide/basic/test-your-project.html +0 -41
  61. package/doc_build/en/guide/basic/use-micro-generator.html +0 -47
  62. package/doc_build/en/guide/basic/using-storybook.html +0 -76
  63. package/doc_build/en/guide/best-practices/components.html +0 -121
  64. package/doc_build/en/guide/faq/build.html +0 -91
  65. package/doc_build/en/guide/faq/index.html +0 -17
  66. package/doc_build/en/guide/faq/storybook.html +0 -53
  67. package/doc_build/en/guide/faq/test.html +0 -16
  68. package/doc_build/en/guide/intro/getting-started.html +0 -53
  69. package/doc_build/en/guide/intro/welcome.html +0 -23
  70. package/doc_build/en/guide/intro/why-module-engineering-solution.html +0 -19
  71. package/doc_build/en/index.html +0 -11
  72. package/doc_build/en/plugins/guide/getting-started.html +0 -25
  73. package/doc_build/en/plugins/guide/plugin-object.html +0 -24
  74. package/doc_build/en/plugins/guide/setup-function.html +0 -40
  75. package/doc_build/en/plugins/official-list/overview.html +0 -19
  76. package/doc_build/en/plugins/official-list/plugin-babel.html +0 -23
  77. package/doc_build/en/plugins/official-list/plugin-banner.html +0 -40
  78. package/doc_build/en/plugins/official-list/plugin-import.html +0 -44
  79. package/doc_build/en/plugins/official-list/plugin-node-polyfill.html +0 -88
  80. package/doc_build/en/plugins/official-list/plugin-polyfill.html +0 -28
  81. package/doc_build/guide/advance/asset.html +0 -31
  82. package/doc_build/guide/advance/build-umd.html +0 -42
  83. package/doc_build/guide/advance/copy.html +0 -52
  84. package/doc_build/guide/advance/external-dependency.html +0 -31
  85. package/doc_build/guide/advance/in-depth-about-build.html +0 -123
  86. package/doc_build/guide/advance/in-depth-about-dev-command.html +0 -32
  87. package/doc_build/guide/advance/theme-config.html +0 -38
  88. package/doc_build/guide/basic/before-getting-started.html +0 -97
  89. package/doc_build/guide/basic/command-preview.html +0 -73
  90. package/doc_build/guide/basic/modify-output-product.html +0 -110
  91. package/doc_build/guide/basic/publish-your-project.html +0 -62
  92. package/doc_build/guide/basic/test-your-project.html +0 -43
  93. package/doc_build/guide/basic/use-micro-generator.html +0 -45
  94. package/doc_build/guide/basic/using-storybook.html +0 -74
  95. package/doc_build/guide/best-practices/components.html +0 -121
  96. package/doc_build/guide/faq/build.html +0 -91
  97. package/doc_build/guide/faq/index.html +0 -17
  98. package/doc_build/guide/faq/storybook.html +0 -53
  99. package/doc_build/guide/faq/test.html +0 -16
  100. package/doc_build/guide/intro/getting-started.html +0 -50
  101. package/doc_build/guide/intro/welcome.html +0 -23
  102. package/doc_build/guide/intro/why-module-engineering-solution.html +0 -19
  103. package/doc_build/index.html +0 -11
  104. package/doc_build/plugins/guide/getting-started.html +0 -25
  105. package/doc_build/plugins/guide/plugin-object.html +0 -24
  106. package/doc_build/plugins/guide/setup-function.html +0 -40
  107. package/doc_build/plugins/official-list/overview.html +0 -19
  108. package/doc_build/plugins/official-list/plugin-babel.html +0 -23
  109. package/doc_build/plugins/official-list/plugin-banner.html +0 -40
  110. package/doc_build/plugins/official-list/plugin-import.html +0 -44
  111. package/doc_build/plugins/official-list/plugin-node-polyfill.html +0 -88
  112. package/doc_build/plugins/official-list/plugin-polyfill.html +0 -28
  113. package/doc_build/route.json +0 -10
  114. package/doc_build/ssr/bundles/main.js +0 -30
  115. package/doc_build/ssr/bundles/main.js.LICENSE.txt +0 -103
  116. package/doc_build/static/css/defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be.71af0621.css +0 -1
  117. package/doc_build/static/css/main.1e1c5ea3.css +0 -17
  118. package/doc_build/static/js/async/default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29.a2443c41.js +0 -1
  119. package/doc_build/static/js/async/docs_en_api_config_build-config_md.47c13184.js +0 -1
  120. package/doc_build/static/js/async/docs_en_api_config_build-preset_mdx.240d175b.js +0 -1
  121. package/doc_build/static/js/async/docs_en_api_config_design-system_md.b2ec1ff7.js +0 -1
  122. package/doc_build/static/js/async/docs_en_api_config_dev_md.6ad208aa.js +0 -1
  123. package/doc_build/static/js/async/docs_en_api_config_plugins_md.da21c1a9.js +0 -1
  124. package/doc_build/static/js/async/docs_en_api_config_testing_md.5655d56b.js +0 -1
  125. package/doc_build/static/js/async/docs_en_api_index_md.b332bf64.js +0 -1
  126. package/doc_build/static/js/async/docs_en_api_plugin-api_plugin-hooks_md.b0f73e0d.js +0 -1
  127. package/doc_build/static/js/async/docs_en_guide_advance_asset_mdx.d302e90c.js +0 -1
  128. package/doc_build/static/js/async/docs_en_guide_advance_build-umd_mdx.554fa073.js +0 -1
  129. package/doc_build/static/js/async/docs_en_guide_advance_copy_md.78b33f73.js +0 -1
  130. package/doc_build/static/js/async/docs_en_guide_advance_external-dependency_mdx.507e4091.js +0 -1
  131. package/doc_build/static/js/async/docs_en_guide_advance_in-depth-about-build_md.207e8b25.js +0 -1
  132. package/doc_build/static/js/async/docs_en_guide_advance_in-depth-about-dev-command_md.72d6b6fc.js +0 -1
  133. package/doc_build/static/js/async/docs_en_guide_advance_theme-config_mdx.168a5eec.js +0 -1
  134. package/doc_build/static/js/async/docs_en_guide_basic_before-getting-started_md.a00933ab.js +0 -1
  135. package/doc_build/static/js/async/docs_en_guide_basic_command-preview_md.5e63d7ad.js +0 -1
  136. package/doc_build/static/js/async/docs_en_guide_basic_modify-output-product_md.abd250e1.js +0 -1
  137. package/doc_build/static/js/async/docs_en_guide_basic_publish-your-project_md.3b098b03.js +0 -1
  138. package/doc_build/static/js/async/docs_en_guide_basic_test-your-project_mdx.b86e9b69.js +0 -1
  139. package/doc_build/static/js/async/docs_en_guide_basic_use-micro-generator_md.e03b16c8.js +0 -1
  140. package/doc_build/static/js/async/docs_en_guide_basic_using-storybook_mdx.32e9b389.js +0 -1
  141. package/doc_build/static/js/async/docs_en_guide_best-practices_components_mdx.a56e369b.js +0 -1
  142. package/doc_build/static/js/async/docs_en_guide_faq_build_mdx.81c243c7.js +0 -1
  143. package/doc_build/static/js/async/docs_en_guide_faq_index_md.85367f4a.js +0 -1
  144. package/doc_build/static/js/async/docs_en_guide_faq_storybook_mdx.d6b26cfd.js +0 -1
  145. package/doc_build/static/js/async/docs_en_guide_faq_test_mdx.a7a1c8b5.js +0 -1
  146. package/doc_build/static/js/async/docs_en_guide_intro_getting-started_md.7c901798.js +0 -1
  147. package/doc_build/static/js/async/docs_en_guide_intro_welcome_md.69fe3324.js +0 -1
  148. package/doc_build/static/js/async/docs_en_guide_intro_why-module-engineering-solution_md.766afaee.js +0 -1
  149. package/doc_build/static/js/async/docs_en_index_md.32415ad9.js +0 -1
  150. package/doc_build/static/js/async/docs_en_plugins_guide_getting-started_mdx.c6631fd6.js +0 -1
  151. package/doc_build/static/js/async/docs_en_plugins_guide_plugin-object_mdx.0971cbdb.js +0 -1
  152. package/doc_build/static/js/async/docs_en_plugins_guide_setup-function_mdx.388d92b1.js +0 -1
  153. package/doc_build/static/js/async/docs_en_plugins_official-list_overview_md.9390ed67.js +0 -1
  154. package/doc_build/static/js/async/docs_en_plugins_official-list_plugin-babel_md.0528b729.js +0 -1
  155. package/doc_build/static/js/async/docs_en_plugins_official-list_plugin-banner_md.c14f8599.js +0 -1
  156. package/doc_build/static/js/async/docs_en_plugins_official-list_plugin-import_mdx.67bac7e1.js +0 -1
  157. package/doc_build/static/js/async/docs_en_plugins_official-list_plugin-node-polyfill_md.19819cf5.js +0 -1
  158. package/doc_build/static/js/async/docs_en_plugins_official-list_plugin-polyfill_md.473537df.js +0 -1
  159. package/doc_build/static/js/async/docs_zh_api_config_build-config_md.e52b0287.js +0 -1
  160. package/doc_build/static/js/async/docs_zh_api_config_build-preset_mdx.8b874378.js +0 -1
  161. package/doc_build/static/js/async/docs_zh_api_config_design-system_md.ceae6914.js +0 -1
  162. package/doc_build/static/js/async/docs_zh_api_config_dev_md.033094f8.js +0 -1
  163. package/doc_build/static/js/async/docs_zh_api_config_plugins_md.ab43b516.js +0 -1
  164. package/doc_build/static/js/async/docs_zh_api_config_testing_md.2c1f171d.js +0 -1
  165. package/doc_build/static/js/async/docs_zh_api_index_md.5df1b9d0.js +0 -1
  166. package/doc_build/static/js/async/docs_zh_api_plugin-api_plugin-hooks_md.9f155180.js +0 -1
  167. package/doc_build/static/js/async/docs_zh_guide_advance_asset_mdx.0b551e5e.js +0 -1
  168. package/doc_build/static/js/async/docs_zh_guide_advance_build-umd_mdx.4c0a741d.js +0 -1
  169. package/doc_build/static/js/async/docs_zh_guide_advance_copy_md.ff70ddd3.js +0 -1
  170. package/doc_build/static/js/async/docs_zh_guide_advance_external-dependency_mdx.64bae82a.js +0 -1
  171. package/doc_build/static/js/async/docs_zh_guide_advance_in-depth-about-build_md.d16f07b4.js +0 -1
  172. package/doc_build/static/js/async/docs_zh_guide_advance_in-depth-about-dev-command_md.2eabb853.js +0 -1
  173. package/doc_build/static/js/async/docs_zh_guide_advance_theme-config_mdx.5670e00b.js +0 -1
  174. package/doc_build/static/js/async/docs_zh_guide_basic_before-getting-started_md.3e23f82e.js +0 -1
  175. package/doc_build/static/js/async/docs_zh_guide_basic_command-preview_md.718669ed.js +0 -1
  176. package/doc_build/static/js/async/docs_zh_guide_basic_modify-output-product_md.bea77add.js +0 -1
  177. package/doc_build/static/js/async/docs_zh_guide_basic_publish-your-project_md.b0c63699.js +0 -1
  178. package/doc_build/static/js/async/docs_zh_guide_basic_test-your-project_mdx.b9ee0af4.js +0 -1
  179. package/doc_build/static/js/async/docs_zh_guide_basic_use-micro-generator_md.ad32d392.js +0 -1
  180. package/doc_build/static/js/async/docs_zh_guide_basic_using-storybook_mdx.2748f6f6.js +0 -1
  181. package/doc_build/static/js/async/docs_zh_guide_best-practices_components_mdx.e4450a3c.js +0 -1
  182. package/doc_build/static/js/async/docs_zh_guide_faq_build_mdx.470ca09d.js +0 -1
  183. package/doc_build/static/js/async/docs_zh_guide_faq_index_md.9c5738a8.js +0 -1
  184. package/doc_build/static/js/async/docs_zh_guide_faq_storybook_mdx.e1fb8e18.js +0 -1
  185. package/doc_build/static/js/async/docs_zh_guide_faq_test_mdx.d332b61f.js +0 -1
  186. package/doc_build/static/js/async/docs_zh_guide_intro_getting-started_md.8af35ffc.js +0 -1
  187. package/doc_build/static/js/async/docs_zh_guide_intro_welcome_md.6169850d.js +0 -1
  188. package/doc_build/static/js/async/docs_zh_guide_intro_why-module-engineering-solution_md.ff0f5ef0.js +0 -1
  189. package/doc_build/static/js/async/docs_zh_index_md.bc7e2f02.js +0 -1
  190. package/doc_build/static/js/async/docs_zh_plugins_guide_getting-started_mdx.6a2c07ee.js +0 -1
  191. package/doc_build/static/js/async/docs_zh_plugins_guide_plugin-object_mdx.9a665baa.js +0 -1
  192. package/doc_build/static/js/async/docs_zh_plugins_guide_setup-function_mdx.a614b224.js +0 -1
  193. package/doc_build/static/js/async/docs_zh_plugins_official-list_overview_md.bf4a7405.js +0 -1
  194. package/doc_build/static/js/async/docs_zh_plugins_official-list_plugin-babel_md.7107a66b.js +0 -1
  195. package/doc_build/static/js/async/docs_zh_plugins_official-list_plugin-banner_md.4443ae99.js +0 -1
  196. package/doc_build/static/js/async/docs_zh_plugins_official-list_plugin-import_mdx.e4923a9a.js +0 -1
  197. package/doc_build/static/js/async/docs_zh_plugins_official-list_plugin-node-polyfill_md.26c9cb0d.js +0 -1
  198. package/doc_build/static/js/async/docs_zh_plugins_official-list_plugin-polyfill_md.0bda701d.js +0 -1
  199. package/doc_build/static/js/defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be.7070a8dd.js +0 -1
  200. package/doc_build/static/js/defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be.7070a8dd.js.LICENSE.txt +0 -20
  201. package/doc_build/static/js/lib-lodash.20527186.js +0 -1
  202. package/doc_build/static/js/lib-polyfill.a99fdfae.js +0 -1
  203. package/doc_build/static/js/lib-react.87879e53.js +0 -1
  204. package/doc_build/static/js/lib-react.87879e53.js.LICENSE.txt +0 -29
  205. package/doc_build/static/js/lib-router.65b37e4a.js +0 -1
  206. package/doc_build/static/js/lib-router.65b37e4a.js.LICENSE.txt +0 -32
  207. package/doc_build/static/js/main.42725889.js +0 -1
  208. package/doc_build/static/search_index.en.6f4165d1.json +0 -1
  209. package/doc_build/static/search_index.en.8cd54797.json +0 -1
  210. package/doc_build/static/search_index.zh.7ed3054c.json +0 -1
  211. package/doc_build/static/search_index.zh.97edcc6e.json +0 -1
@@ -1,443 +0,0 @@
1
- <!doctype html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1">
2
- <script id="check-dark-light">
3
- ;(() => {
4
- const saved = localStorage.getItem('modern-theme-appearance')
5
- const prefereDark = window.matchMedia('(prefers-color-scheme: dark)').matches
6
- if (!saved || saved === 'auto' ? prefereDark : saved === 'dark') {
7
- document.documentElement.classList.add('dark')
8
- }
9
- })()
10
- </script>
11
- <link rel="icon" href="https://lf3-static.bytednsdoc.com/obj/eden-cn/zq-uylkvT/ljhwZthlaukjlkulzlp/logo-1x-0104.png"><script defer="defer">!function(){var _,d,s,e,c,i,n,o,a,t,u={},g={};function f(_){var d=g[_];if(void 0!==d)return d.exports;var s=g[_]={exports:{}};return u[_](s,s.exports,f),s.exports}f.m=u,!function(){function _(d){if("function"!=typeof WeakMap)return null;var s=new WeakMap,e=new WeakMap;return(_=function(_){return _?e:s})(d)}f.ir=function(d,s){if(!s&&d&&d.__esModule)return d;if(null===d||"object"!=typeof d&&"function"!=typeof d)return{default:d};var e=_(s);if(e&&e.has(d))return e.get(d);var c={},i=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var n in d)if("default"!==n&&Object.prototype.hasOwnProperty.call(d,n)){var o=i?Object.getOwnPropertyDescriptor(d,n):null;o&&(o.get||o.set)?Object.defineProperty(c,n,o):c[n]=d[n]}return c.default=d,e&&e.set(d,c),c}}(),f.es=function(_,d){return Object.keys(_).forEach(function(s){"default"!==s&&!Object.prototype.hasOwnProperty.call(d,s)&&Object.defineProperty(d,s,{enumerable:!0,get:function(){return _[s]}})}),_},_={10138:[],10179:[],10299:[],10530:[],10825:[],10929:[],11096:[],11385:[],11413:[],1163:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_plugins_guide_plugin-object_mdx"],11665:[],11678:[],11696:[],12764:[],12784:[],1282:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_api_plugin-api_plugin-hooks_md"],12855:[],13139:[],13251:[],13259:[],13345:[],13397:[],13473:[],13487:["docs_en_api_index_md"],13507:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_api_config_build-preset_mdx"],13545:[],13637:[],13652:[],13835:[],13867:[],13915:[],14095:[],14115:[],14120:[],14309:[],14423:[],14641:[],14704:[],15028:[],15042:[],1509:[],15624:[],15710:[],15863:[],15880:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_advance_copy_md"],16726:[],16737:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_advance_build-umd_mdx"],17100:[],17190:[],17290:[],17331:[],17713:["docs_zh_index_md"],17816:[],17832:[],17912:[],18055:[],18456:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_basic_using-storybook_mdx"],18595:[],18673:[],18989:["default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29"],19054:[],19585:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_api_plugin-api_plugin-hooks_md"],19805:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_basic_command-preview_md"],20150:[],20250:[],20308:[],20345:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_advance_external-dependency_mdx"],20449:[],20551:[],2056:[],20590:[],20678:[],20758:[],20826:["default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29"],20976:[],21382:[],21397:[],21666:["docs_en_guide_intro_why-module-engineering-solution_md"],21699:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_advance_in-depth-about-dev-command_md"],21724:["docs_en_index_md"],21774:[],21829:[],21893:[],22101:[],2212:[],22124:[],22151:[],2225:[],22297:["default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29"],22326:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_api_config_testing_md"],22430:[],2250:[],22588:["docs_zh_guide_faq_index_md"],22947:[],23037:[],23095:[],23112:[],23148:[],23172:[],23205:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_plugins_official-list_plugin-import_mdx"],23279:[],23570:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_advance_asset_mdx"],23759:[],23931:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_basic_publish-your-project_md"],24198:[],24359:[],24622:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_basic_test-your-project_mdx"],24667:[],24786:[],25010:["default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29"],25355:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_api_config_design-system_md"],25483:[],25806:["default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29"],26201:[],26281:[],26367:[],2637:[],26443:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_basic_modify-output-product_md"],26444:[],2663:[],26693:[],26723:[],26825:[],27151:[],27267:[],2733:[],27610:[],27677:[],27732:[],27844:[],28020:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_best-practices_components_mdx"],28049:[],28117:[],28263:[],28268:[],28547:[],28840:[],28846:[],29203:[],29391:[],29608:[],29645:[],29874:[],30075:[],30108:[],30251:[],30354:[],30372:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_advance_theme-config_mdx"],30732:[],3105:[],3123:[],31250:[],31360:[],31601:[],31874:[],31958:[],3204:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_plugins_guide_getting-started_mdx"],32046:[],3247:[],32560:[],32573:["docs_zh_guide_intro_welcome_md"],32694:[],32908:[],32910:[],33232:[],33379:[],33588:[],33786:[],34165:[],34189:[],34243:[],34700:[],34724:[],34799:[],35179:[],35289:[],35393:[],35574:[],35605:[],35803:[],35944:[],36034:[],36333:[],36448:[],36797:[],36889:[],37036:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_best-practices_components_mdx"],37137:[],37359:[],37430:[],38058:[],38091:[],38113:[],38472:[],3860:[],39040:[],39108:[],39198:[],39235:[],39605:[],39802:[],40428:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_basic_command-preview_md"],41413:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_api_config_plugins_md"],41472:[],41538:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_advance_in-depth-about-build_md"],41541:[],41567:[],42271:[],42283:[],42292:[],42368:[],42483:[],42731:[],42882:[],43179:[],43290:[],43409:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_api_config_plugins_md"],44113:[],44491:[],44802:[],44855:[],45127:["docs_en_guide_faq_index_md"],45141:[],45213:[],45317:[],45457:[],45914:[],45995:[],46256:[],46285:[],46333:["docs_en_plugins_official-list_overview_md"],46485:[],46680:[],4669:[],46800:[],4697:[],46997:[],47166:[],47319:[],47425:[],47746:[],47750:[],47812:[],47874:[],47887:[],47966:[],48087:[],48350:[],48395:[],48407:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_plugins_guide_setup-function_mdx"],48947:[],4897:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_plugins_guide_setup-function_mdx"],49139:[],49317:[],49545:[],49597:[],49689:[],49828:[],49930:[],5011:[],50409:[],50598:[],50775:[],50811:[],50918:[],50967:[],51012:[],5134:[],51349:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_api_config_testing_md"],51563:[],51791:[],51811:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_plugins_official-list_plugin-babel_md"],52256:[],52326:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_intro_getting-started_md"],52534:[],53159:[],53325:[],5340:[],53472:[],53481:[],53600:[],53713:[],54008:[],54011:[],54070:[],54233:[],5442:["default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29"],54477:[],54555:[],5474:[],54905:[],54947:[],55190:[],55665:["default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29"],55962:[],55980:[],56022:[],56145:[],56231:[],56470:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_plugins_official-list_plugin-node-polyfill_md"],56747:[],56856:[],56979:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_plugins_official-list_plugin-banner_md"],58050:[],58220:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_advance_theme-config_mdx"],58598:[],5872:[],58795:[],58879:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_api_config_build-config_md"],59142:[],59195:[],59359:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_advance_external-dependency_mdx"],59513:[],59770:[],5978:[],59823:[],59882:[],59934:[],60035:["docs_zh_plugins_official-list_overview_md"],60241:[],60343:[],60455:[],60499:[],60564:[],60599:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_basic_test-your-project_mdx"],61034:[],61117:[],61313:[],61785:[],61820:[],61839:[],61919:[],61976:[],62157:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_advance_copy_md"],62191:[],62263:[],62450:[],62568:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29","docs_en_guide_faq_build_mdx"],62573:[],6263:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29","docs_en_guide_faq_storybook_mdx"],63159:[],63373:[],63604:[],63897:[],63981:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_plugins_official-list_plugin-polyfill_md"],64043:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29","docs_zh_guide_faq_storybook_mdx"],64314:[],64442:[],64846:[],64871:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_api_config_build-preset_mdx"],64934:[],64956:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_basic_using-storybook_mdx"],64977:[],6498:[],65167:[],65845:[],6601:[],66605:[],67363:[],67404:[],67417:[],67429:[],67684:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_advance_asset_mdx"],6798:["default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29"],67991:[],68279:[],68427:[],68537:[],69129:[],69183:["default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29"],69424:[],69561:[],69668:[],69870:[],70196:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_plugins_guide_getting-started_mdx"],70220:[],70365:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_plugins_official-list_plugin-banner_md"],70481:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_plugins_official-list_plugin-node-polyfill_md"],70555:[],70714:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_basic_before-getting-started_md"],70863:[],7093:[],71152:[],71203:[],71347:[],71527:[],71765:[],71815:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_intro_getting-started_md"],71870:[],72296:[],72758:[],73027:[],73196:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_plugins_official-list_plugin-polyfill_md"],73218:[],7342:[],73450:[],73514:[],73653:[],73789:[],73960:[],73987:[],74381:[],74457:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_basic_use-micro-generator_md"],7472:[],75191:[],75240:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_plugins_guide_plugin-object_mdx"],75271:[],75367:[],75639:[],757:[],75796:[],76280:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_api_config_dev_md"],76318:[],76550:[],76596:[],76629:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_guide_basic_use-micro-generator_md"],76716:[],77075:[],77175:[],77247:[],7797:[],78153:[],78171:[],7830:[],7833:[],7836:[],78844:[],79018:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_plugins_official-list_plugin-babel_md"],79316:["docs_zh_api_index_md"],79561:[],79712:[],80051:[],80209:[],80260:[],80613:[],80748:[],80749:[],80785:[],80866:[],80955:[],81125:[],81150:["default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29","docs_zh_guide_faq_test_mdx"],8130:[],81680:[],82431:[],82739:[],82863:[],82970:[],83668:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_api_config_dev_md"],83746:[],83821:[],83834:[],83937:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29","docs_zh_guide_faq_build_mdx"],84386:[],8442:[],84623:[],84641:[],84642:[],84716:[],84755:[],8495:[],85015:[],85028:[],85221:[],85300:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_advance_build-umd_mdx"],85349:[],8572:[],85826:[],85844:[],85849:[],85894:[],85936:[],8607:[],86668:[],86967:["default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29","docs_en_guide_faq_test_mdx"],87442:[],87674:["docs_zh_guide_intro_why-module-engineering-solution_md"],8773:[],87894:[],8793:[],8837:["default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29"],88429:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_api_config_design-system_md"],88627:[],88628:[],88655:[],89053:[],89280:[],89455:[],89943:[],89967:[],90312:[],90323:[],90388:[],9044:[],90544:[],90573:[],90683:[],91032:[],91237:[],91259:[],913:[],91328:[],91345:[],91544:[],91862:[],91940:[],92077:[],92128:[],92484:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_advance_in-depth-about-dev-command_md"],9254:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_zh_plugins_official-list_plugin-import_mdx"],92581:[],92646:[],92945:[],93231:[],93233:["docs_en_guide_intro_welcome_md"],93395:[],93696:[],93810:[],93871:[],93907:[],93965:[],9425:[],94369:[],94787:[],94958:[],95028:[],95060:[],95076:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_basic_before-getting-started_md"],9538:[],95588:[],95603:[],95737:[],95907:[],96051:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_api_config_build-config_md"],96072:[],96266:[],96349:[],96357:[],96558:[],9669:[],96826:[],96858:[],96918:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_advance_in-depth-about-build_md"],9700:[],9704:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_basic_modify-output-product_md"],9733:[],97359:[],97415:[],97699:[],97729:[],97766:[],97919:[],98207:["defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be","docs_en_guide_basic_publish-your-project_md"],98217:[],98226:[],98326:[],99179:[],99408:[],99553:[],9968:[],99765:[]},f.el=function(d){var s=_[d];return void 0===s?Promise.resolve():s.length>1?Promise.all(s.map(f.e)):f.e(s[0])},f.f={},f.e=function(_){return Promise.all(Object.keys(f.f).reduce(function(d,s){return f.f[s](_,d),d},[]))},f.p="/module-tools/",f.u=function(_){return({"default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29":"static/js/async/default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29.a2443c41.js","docs_en_api_config_build-config_md":"static/js/async/docs_en_api_config_build-config_md.47c13184.js","docs_en_api_config_build-preset_mdx":"static/js/async/docs_en_api_config_build-preset_mdx.240d175b.js","docs_en_api_config_design-system_md":"static/js/async/docs_en_api_config_design-system_md.b2ec1ff7.js",docs_en_api_config_dev_md:"static/js/async/docs_en_api_config_dev_md.6ad208aa.js",docs_en_api_config_plugins_md:"static/js/async/docs_en_api_config_plugins_md.da21c1a9.js",docs_en_api_config_testing_md:"static/js/async/docs_en_api_config_testing_md.5655d56b.js",docs_en_api_index_md:"static/js/async/docs_en_api_index_md.b332bf64.js","docs_en_api_plugin-api_plugin-hooks_md":"static/js/async/docs_en_api_plugin-api_plugin-hooks_md.b0f73e0d.js",docs_en_guide_advance_asset_mdx:"static/js/async/docs_en_guide_advance_asset_mdx.d302e90c.js","docs_en_guide_advance_build-umd_mdx":"static/js/async/docs_en_guide_advance_build-umd_mdx.554fa073.js",docs_en_guide_advance_copy_md:"static/js/async/docs_en_guide_advance_copy_md.78b33f73.js","docs_en_guide_advance_external-dependency_mdx":"static/js/async/docs_en_guide_advance_external-dependency_mdx.507e4091.js","docs_en_guide_advance_in-depth-about-build_md":"static/js/async/docs_en_guide_advance_in-depth-about-build_md.207e8b25.js","docs_en_guide_advance_in-depth-about-dev-command_md":"static/js/async/docs_en_guide_advance_in-depth-about-dev-command_md.72d6b6fc.js","docs_en_guide_advance_theme-config_mdx":"static/js/async/docs_en_guide_advance_theme-config_mdx.168a5eec.js","docs_en_guide_basic_before-getting-started_md":"static/js/async/docs_en_guide_basic_before-getting-started_md.a00933ab.js","docs_en_guide_basic_command-preview_md":"static/js/async/docs_en_guide_basic_command-preview_md.5e63d7ad.js","docs_en_guide_basic_modify-output-product_md":"static/js/async/docs_en_guide_basic_modify-output-product_md.abd250e1.js","docs_en_guide_basic_publish-your-project_md":"static/js/async/docs_en_guide_basic_publish-your-project_md.3b098b03.js","docs_en_guide_basic_test-your-project_mdx":"static/js/async/docs_en_guide_basic_test-your-project_mdx.b86e9b69.js","docs_en_guide_basic_use-micro-generator_md":"static/js/async/docs_en_guide_basic_use-micro-generator_md.e03b16c8.js","docs_en_guide_basic_using-storybook_mdx":"static/js/async/docs_en_guide_basic_using-storybook_mdx.32e9b389.js","docs_en_guide_best-practices_components_mdx":"static/js/async/docs_en_guide_best-practices_components_mdx.a56e369b.js",docs_en_guide_faq_build_mdx:"static/js/async/docs_en_guide_faq_build_mdx.81c243c7.js",docs_en_guide_faq_index_md:"static/js/async/docs_en_guide_faq_index_md.85367f4a.js",docs_en_guide_faq_storybook_mdx:"static/js/async/docs_en_guide_faq_storybook_mdx.d6b26cfd.js",docs_en_guide_faq_test_mdx:"static/js/async/docs_en_guide_faq_test_mdx.a7a1c8b5.js","docs_en_guide_intro_getting-started_md":"static/js/async/docs_en_guide_intro_getting-started_md.7c901798.js",docs_en_guide_intro_welcome_md:"static/js/async/docs_en_guide_intro_welcome_md.69fe3324.js","docs_en_guide_intro_why-module-engineering-solution_md":"static/js/async/docs_en_guide_intro_why-module-engineering-solution_md.766afaee.js",docs_en_index_md:"static/js/async/docs_en_index_md.32415ad9.js","docs_en_plugins_guide_getting-started_mdx":"static/js/async/docs_en_plugins_guide_getting-started_mdx.c6631fd6.js","docs_en_plugins_guide_plugin-object_mdx":"static/js/async/docs_en_plugins_guide_plugin-object_mdx.0971cbdb.js","docs_en_plugins_guide_setup-function_mdx":"static/js/async/docs_en_plugins_guide_setup-function_mdx.388d92b1.js","docs_en_plugins_official-list_overview_md":"static/js/async/docs_en_plugins_official-list_overview_md.9390ed67.js","docs_en_plugins_official-list_plugin-babel_md":"static/js/async/docs_en_plugins_official-list_plugin-babel_md.0528b729.js","docs_en_plugins_official-list_plugin-banner_md":"static/js/async/docs_en_plugins_official-list_plugin-banner_md.c14f8599.js","docs_en_plugins_official-list_plugin-import_mdx":"static/js/async/docs_en_plugins_official-list_plugin-import_mdx.67bac7e1.js","docs_en_plugins_official-list_plugin-node-polyfill_md":"static/js/async/docs_en_plugins_official-list_plugin-node-polyfill_md.19819cf5.js","docs_en_plugins_official-list_plugin-polyfill_md":"static/js/async/docs_en_plugins_official-list_plugin-polyfill_md.473537df.js","docs_zh_api_config_build-config_md":"static/js/async/docs_zh_api_config_build-config_md.e52b0287.js","docs_zh_api_config_build-preset_mdx":"static/js/async/docs_zh_api_config_build-preset_mdx.8b874378.js","docs_zh_api_config_design-system_md":"static/js/async/docs_zh_api_config_design-system_md.ceae6914.js",docs_zh_api_config_dev_md:"static/js/async/docs_zh_api_config_dev_md.033094f8.js",docs_zh_api_config_plugins_md:"static/js/async/docs_zh_api_config_plugins_md.ab43b516.js",docs_zh_api_config_testing_md:"static/js/async/docs_zh_api_config_testing_md.2c1f171d.js",docs_zh_api_index_md:"static/js/async/docs_zh_api_index_md.5df1b9d0.js","docs_zh_api_plugin-api_plugin-hooks_md":"static/js/async/docs_zh_api_plugin-api_plugin-hooks_md.9f155180.js",docs_zh_guide_advance_asset_mdx:"static/js/async/docs_zh_guide_advance_asset_mdx.0b551e5e.js","docs_zh_guide_advance_build-umd_mdx":"static/js/async/docs_zh_guide_advance_build-umd_mdx.4c0a741d.js",docs_zh_guide_advance_copy_md:"static/js/async/docs_zh_guide_advance_copy_md.ff70ddd3.js","docs_zh_guide_advance_external-dependency_mdx":"static/js/async/docs_zh_guide_advance_external-dependency_mdx.64bae82a.js","docs_zh_guide_advance_in-depth-about-build_md":"static/js/async/docs_zh_guide_advance_in-depth-about-build_md.d16f07b4.js","docs_zh_guide_advance_in-depth-about-dev-command_md":"static/js/async/docs_zh_guide_advance_in-depth-about-dev-command_md.2eabb853.js","docs_zh_guide_advance_theme-config_mdx":"static/js/async/docs_zh_guide_advance_theme-config_mdx.5670e00b.js","docs_zh_guide_basic_before-getting-started_md":"static/js/async/docs_zh_guide_basic_before-getting-started_md.3e23f82e.js","docs_zh_guide_basic_command-preview_md":"static/js/async/docs_zh_guide_basic_command-preview_md.718669ed.js","docs_zh_guide_basic_modify-output-product_md":"static/js/async/docs_zh_guide_basic_modify-output-product_md.bea77add.js","docs_zh_guide_basic_publish-your-project_md":"static/js/async/docs_zh_guide_basic_publish-your-project_md.b0c63699.js","docs_zh_guide_basic_test-your-project_mdx":"static/js/async/docs_zh_guide_basic_test-your-project_mdx.b9ee0af4.js","docs_zh_guide_basic_use-micro-generator_md":"static/js/async/docs_zh_guide_basic_use-micro-generator_md.ad32d392.js","docs_zh_guide_basic_using-storybook_mdx":"static/js/async/docs_zh_guide_basic_using-storybook_mdx.2748f6f6.js","docs_zh_guide_best-practices_components_mdx":"static/js/async/docs_zh_guide_best-practices_components_mdx.e4450a3c.js",docs_zh_guide_faq_build_mdx:"static/js/async/docs_zh_guide_faq_build_mdx.470ca09d.js",docs_zh_guide_faq_index_md:"static/js/async/docs_zh_guide_faq_index_md.9c5738a8.js",docs_zh_guide_faq_storybook_mdx:"static/js/async/docs_zh_guide_faq_storybook_mdx.e1fb8e18.js",docs_zh_guide_faq_test_mdx:"static/js/async/docs_zh_guide_faq_test_mdx.d332b61f.js","docs_zh_guide_intro_getting-started_md":"static/js/async/docs_zh_guide_intro_getting-started_md.8af35ffc.js",docs_zh_guide_intro_welcome_md:"static/js/async/docs_zh_guide_intro_welcome_md.6169850d.js","docs_zh_guide_intro_why-module-engineering-solution_md":"static/js/async/docs_zh_guide_intro_why-module-engineering-solution_md.ff0f5ef0.js",docs_zh_index_md:"static/js/async/docs_zh_index_md.bc7e2f02.js","docs_zh_plugins_guide_getting-started_mdx":"static/js/async/docs_zh_plugins_guide_getting-started_mdx.6a2c07ee.js","docs_zh_plugins_guide_plugin-object_mdx":"static/js/async/docs_zh_plugins_guide_plugin-object_mdx.9a665baa.js","docs_zh_plugins_guide_setup-function_mdx":"static/js/async/docs_zh_plugins_guide_setup-function_mdx.a614b224.js","docs_zh_plugins_official-list_overview_md":"static/js/async/docs_zh_plugins_official-list_overview_md.bf4a7405.js","docs_zh_plugins_official-list_plugin-babel_md":"static/js/async/docs_zh_plugins_official-list_plugin-babel_md.7107a66b.js","docs_zh_plugins_official-list_plugin-banner_md":"static/js/async/docs_zh_plugins_official-list_plugin-banner_md.4443ae99.js","docs_zh_plugins_official-list_plugin-import_mdx":"static/js/async/docs_zh_plugins_official-list_plugin-import_mdx.e4923a9a.js","docs_zh_plugins_official-list_plugin-node-polyfill_md":"static/js/async/docs_zh_plugins_official-list_plugin-node-polyfill_md.26c9cb0d.js","docs_zh_plugins_official-list_plugin-polyfill_md":"static/js/async/docs_zh_plugins_official-list_plugin-polyfill_md.0bda701d.js"})[_]},f.k=function(_){return({"default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29":"static/css/async/default~docs_en_guide_faq_build_mdx~docs_en_guide_faq_storybook_mdx~docs_en_guide_faq_test_md~931d29.d9ac876f.css","docs_en_api_config_build-config_md":"static/css/async/docs_en_api_config_build-config_md.d9ac876f.css","docs_en_api_config_build-preset_mdx":"static/css/async/docs_en_api_config_build-preset_mdx.d9ac876f.css","docs_en_api_config_design-system_md":"static/css/async/docs_en_api_config_design-system_md.d9ac876f.css",docs_en_api_config_dev_md:"static/css/async/docs_en_api_config_dev_md.d9ac876f.css",docs_en_api_config_plugins_md:"static/css/async/docs_en_api_config_plugins_md.d9ac876f.css",docs_en_api_config_testing_md:"static/css/async/docs_en_api_config_testing_md.d9ac876f.css",docs_en_api_index_md:"static/css/async/docs_en_api_index_md.d9ac876f.css","docs_en_api_plugin-api_plugin-hooks_md":"static/css/async/docs_en_api_plugin-api_plugin-hooks_md.d9ac876f.css",docs_en_guide_advance_asset_mdx:"static/css/async/docs_en_guide_advance_asset_mdx.d9ac876f.css","docs_en_guide_advance_build-umd_mdx":"static/css/async/docs_en_guide_advance_build-umd_mdx.d9ac876f.css",docs_en_guide_advance_copy_md:"static/css/async/docs_en_guide_advance_copy_md.d9ac876f.css","docs_en_guide_advance_external-dependency_mdx":"static/css/async/docs_en_guide_advance_external-dependency_mdx.d9ac876f.css","docs_en_guide_advance_in-depth-about-build_md":"static/css/async/docs_en_guide_advance_in-depth-about-build_md.d9ac876f.css","docs_en_guide_advance_in-depth-about-dev-command_md":"static/css/async/docs_en_guide_advance_in-depth-about-dev-command_md.d9ac876f.css","docs_en_guide_advance_theme-config_mdx":"static/css/async/docs_en_guide_advance_theme-config_mdx.d9ac876f.css","docs_en_guide_basic_before-getting-started_md":"static/css/async/docs_en_guide_basic_before-getting-started_md.d9ac876f.css","docs_en_guide_basic_command-preview_md":"static/css/async/docs_en_guide_basic_command-preview_md.d9ac876f.css","docs_en_guide_basic_modify-output-product_md":"static/css/async/docs_en_guide_basic_modify-output-product_md.d9ac876f.css","docs_en_guide_basic_publish-your-project_md":"static/css/async/docs_en_guide_basic_publish-your-project_md.d9ac876f.css","docs_en_guide_basic_test-your-project_mdx":"static/css/async/docs_en_guide_basic_test-your-project_mdx.d9ac876f.css","docs_en_guide_basic_use-micro-generator_md":"static/css/async/docs_en_guide_basic_use-micro-generator_md.d9ac876f.css","docs_en_guide_basic_using-storybook_mdx":"static/css/async/docs_en_guide_basic_using-storybook_mdx.d9ac876f.css","docs_en_guide_best-practices_components_mdx":"static/css/async/docs_en_guide_best-practices_components_mdx.d9ac876f.css",docs_en_guide_faq_build_mdx:"static/css/async/docs_en_guide_faq_build_mdx.d9ac876f.css",docs_en_guide_faq_index_md:"static/css/async/docs_en_guide_faq_index_md.d9ac876f.css",docs_en_guide_faq_storybook_mdx:"static/css/async/docs_en_guide_faq_storybook_mdx.d9ac876f.css",docs_en_guide_faq_test_mdx:"static/css/async/docs_en_guide_faq_test_mdx.d9ac876f.css","docs_en_guide_intro_getting-started_md":"static/css/async/docs_en_guide_intro_getting-started_md.d9ac876f.css",docs_en_guide_intro_welcome_md:"static/css/async/docs_en_guide_intro_welcome_md.d9ac876f.css","docs_en_guide_intro_why-module-engineering-solution_md":"static/css/async/docs_en_guide_intro_why-module-engineering-solution_md.d9ac876f.css",docs_en_index_md:"static/css/async/docs_en_index_md.d9ac876f.css","docs_en_plugins_guide_getting-started_mdx":"static/css/async/docs_en_plugins_guide_getting-started_mdx.d9ac876f.css","docs_en_plugins_guide_plugin-object_mdx":"static/css/async/docs_en_plugins_guide_plugin-object_mdx.d9ac876f.css","docs_en_plugins_guide_setup-function_mdx":"static/css/async/docs_en_plugins_guide_setup-function_mdx.d9ac876f.css","docs_en_plugins_official-list_overview_md":"static/css/async/docs_en_plugins_official-list_overview_md.d9ac876f.css","docs_en_plugins_official-list_plugin-babel_md":"static/css/async/docs_en_plugins_official-list_plugin-babel_md.d9ac876f.css","docs_en_plugins_official-list_plugin-banner_md":"static/css/async/docs_en_plugins_official-list_plugin-banner_md.d9ac876f.css","docs_en_plugins_official-list_plugin-import_mdx":"static/css/async/docs_en_plugins_official-list_plugin-import_mdx.d9ac876f.css","docs_en_plugins_official-list_plugin-node-polyfill_md":"static/css/async/docs_en_plugins_official-list_plugin-node-polyfill_md.d9ac876f.css","docs_en_plugins_official-list_plugin-polyfill_md":"static/css/async/docs_en_plugins_official-list_plugin-polyfill_md.d9ac876f.css","docs_zh_api_config_build-config_md":"static/css/async/docs_zh_api_config_build-config_md.d9ac876f.css","docs_zh_api_config_build-preset_mdx":"static/css/async/docs_zh_api_config_build-preset_mdx.d9ac876f.css","docs_zh_api_config_design-system_md":"static/css/async/docs_zh_api_config_design-system_md.d9ac876f.css",docs_zh_api_config_dev_md:"static/css/async/docs_zh_api_config_dev_md.d9ac876f.css",docs_zh_api_config_plugins_md:"static/css/async/docs_zh_api_config_plugins_md.d9ac876f.css",docs_zh_api_config_testing_md:"static/css/async/docs_zh_api_config_testing_md.d9ac876f.css",docs_zh_api_index_md:"static/css/async/docs_zh_api_index_md.d9ac876f.css","docs_zh_api_plugin-api_plugin-hooks_md":"static/css/async/docs_zh_api_plugin-api_plugin-hooks_md.d9ac876f.css",docs_zh_guide_advance_asset_mdx:"static/css/async/docs_zh_guide_advance_asset_mdx.d9ac876f.css","docs_zh_guide_advance_build-umd_mdx":"static/css/async/docs_zh_guide_advance_build-umd_mdx.d9ac876f.css",docs_zh_guide_advance_copy_md:"static/css/async/docs_zh_guide_advance_copy_md.d9ac876f.css","docs_zh_guide_advance_external-dependency_mdx":"static/css/async/docs_zh_guide_advance_external-dependency_mdx.d9ac876f.css","docs_zh_guide_advance_in-depth-about-build_md":"static/css/async/docs_zh_guide_advance_in-depth-about-build_md.d9ac876f.css","docs_zh_guide_advance_in-depth-about-dev-command_md":"static/css/async/docs_zh_guide_advance_in-depth-about-dev-command_md.d9ac876f.css","docs_zh_guide_advance_theme-config_mdx":"static/css/async/docs_zh_guide_advance_theme-config_mdx.d9ac876f.css","docs_zh_guide_basic_before-getting-started_md":"static/css/async/docs_zh_guide_basic_before-getting-started_md.d9ac876f.css","docs_zh_guide_basic_command-preview_md":"static/css/async/docs_zh_guide_basic_command-preview_md.d9ac876f.css","docs_zh_guide_basic_modify-output-product_md":"static/css/async/docs_zh_guide_basic_modify-output-product_md.d9ac876f.css","docs_zh_guide_basic_publish-your-project_md":"static/css/async/docs_zh_guide_basic_publish-your-project_md.d9ac876f.css","docs_zh_guide_basic_test-your-project_mdx":"static/css/async/docs_zh_guide_basic_test-your-project_mdx.d9ac876f.css","docs_zh_guide_basic_use-micro-generator_md":"static/css/async/docs_zh_guide_basic_use-micro-generator_md.d9ac876f.css","docs_zh_guide_basic_using-storybook_mdx":"static/css/async/docs_zh_guide_basic_using-storybook_mdx.d9ac876f.css","docs_zh_guide_best-practices_components_mdx":"static/css/async/docs_zh_guide_best-practices_components_mdx.d9ac876f.css",docs_zh_guide_faq_build_mdx:"static/css/async/docs_zh_guide_faq_build_mdx.d9ac876f.css",docs_zh_guide_faq_index_md:"static/css/async/docs_zh_guide_faq_index_md.d9ac876f.css",docs_zh_guide_faq_storybook_mdx:"static/css/async/docs_zh_guide_faq_storybook_mdx.d9ac876f.css",docs_zh_guide_faq_test_mdx:"static/css/async/docs_zh_guide_faq_test_mdx.d9ac876f.css","docs_zh_guide_intro_getting-started_md":"static/css/async/docs_zh_guide_intro_getting-started_md.d9ac876f.css",docs_zh_guide_intro_welcome_md:"static/css/async/docs_zh_guide_intro_welcome_md.d9ac876f.css","docs_zh_guide_intro_why-module-engineering-solution_md":"static/css/async/docs_zh_guide_intro_why-module-engineering-solution_md.d9ac876f.css",docs_zh_index_md:"static/css/async/docs_zh_index_md.d9ac876f.css","docs_zh_plugins_guide_getting-started_mdx":"static/css/async/docs_zh_plugins_guide_getting-started_mdx.d9ac876f.css","docs_zh_plugins_guide_plugin-object_mdx":"static/css/async/docs_zh_plugins_guide_plugin-object_mdx.d9ac876f.css","docs_zh_plugins_guide_setup-function_mdx":"static/css/async/docs_zh_plugins_guide_setup-function_mdx.d9ac876f.css","docs_zh_plugins_official-list_overview_md":"static/css/async/docs_zh_plugins_official-list_overview_md.d9ac876f.css","docs_zh_plugins_official-list_plugin-babel_md":"static/css/async/docs_zh_plugins_official-list_plugin-babel_md.d9ac876f.css","docs_zh_plugins_official-list_plugin-banner_md":"static/css/async/docs_zh_plugins_official-list_plugin-banner_md.d9ac876f.css","docs_zh_plugins_official-list_plugin-import_mdx":"static/css/async/docs_zh_plugins_official-list_plugin-import_mdx.d9ac876f.css","docs_zh_plugins_official-list_plugin-node-polyfill_md":"static/css/async/docs_zh_plugins_official-list_plugin-node-polyfill_md.d9ac876f.css","docs_zh_plugins_official-list_plugin-polyfill_md":"static/css/async/docs_zh_plugins_official-list_plugin-polyfill_md.d9ac876f.css"})[_]},d={},f.l=function(_,s,e,c){if(void 0!==e){for(var i,n,o=document.getElementsByTagName("script"),a=0;a<o.length;a++){var t=o[a];if(t.getAttribute("src")==_){i=t;break}}}!i&&(n=!0,(i=document.createElement("script")).charset="utf-8",i.timeout=120,i.src=_),d[_]=[s];var u=function(s,e){i.onerror=i.onload=null,clearTimeout(g);var c=d[_];if(delete d[_],i.parentNode&&i.parentNode.removeChild(i),c&&c.forEach(function(_){return _(e)}),s)return s(e)},g=setTimeout(u.bind(null,void 0,{type:"timeout",target:i}),12e4);i.onerror=u.bind(null,i.onerror),i.onload=u.bind(null,i.onload),n&&document.head.appendChild(i)},f.o=function(_,d){return Object.prototype.hasOwnProperty.call(_,d)},s=[],f.O=function(_,d,e,c){if(d){c=c||0;for(var i=s.length;i>0&&s[i-1][2]>c;i--)s[i]=s[i-1];s[i]=[d,e,c];return}for(var n=1/0,i=0;i<s.length;i++){for(var d=s[i][0],e=s[i][1],c=s[i][2],o=!0,a=0;a<d.length;a++)n>=c&&Object.keys(f.O).every(function(_){return f.O[_](d[a])})?d.splice(a--,1):(o=!1,c<n&&(n=c));if(o){s.splice(i--,1);var t=e();void 0!==t&&(_=t)}}return _},f.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||Function("return this")()}catch(_){if("object"==typeof window)return window}}(),e={"builder-runtime":0},f.f.j=function(_,d){var s=f.o(e,_)?e[_]:void 0;if(0!==s){if(s)d.push(s[2]);else if(_){var c=new Promise(function(d,c){s=e[_]=[d,c]});d.push(s[2]=c);var i=f.p+f.u(_),n=Error();f.l(i,function(d){if(f.o(e,_)&&(0!==(s=e[_])&&(e[_]=void 0),s)){var c=d&&("load"===d.type?"missing":d.type),i=d&&d.target&&d.target.src;n.message="Loading chunk "+_+" failed.\n("+c+": "+i+")",n.name="ChunkLoadError",n.type=c,n.request=i,s[1](n)}},"chunk-"+_,_)}else e[_]=0}},f.O.j=function(_){return 0===e[_]},c=function(_,d){var s=d[0],c=d[1],i=d[2],n,o,a=0;if(s.some(function(_){return 0!==e[_]})){for(n in c)f.o(c,n)&&(f.m[n]=c[n]);if(i)var t=i(f)}for(_&&_(d);a<s.length;a++)o=s[a],f.o(e,o)&&e[o]&&e[o][0](),e[o]=0;return f.O(t)},i=self.webpackChunk_modern_js_module_tools_docs=self.webpackChunk_modern_js_module_tools_docs||[],i.forEach(c.bind(null,0)),i.push=c.bind(null,i.push.bind(i)),n={"defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be":0,main:0},o="webpack",a="data-webpack-loading",t=function(_,d,s,e){var c,i,n="chunk-"+_;if(!e){for(var t=document.getElementsByTagName("link"),u=0;u<t.length;u++){var g=t[u],l=g.getAttribute("href")||g.href;if(l&&!l.startsWith(f.p)&&(l=f.p+(l.startsWith("/")?l.slice(1):l)),"stylesheet"==g.rel&&(l&&l.startsWith(d)||g.getAttribute("data-webpack")==o+":"+n)){c=g;break}}if(!s)return c}!c&&(i=!0,(c=document.createElement("link")).setAttribute("data-webpack",o+":"+n),c.setAttribute(a,1),c.rel="stylesheet",c.href=d);var m=function(_,d){if(c.onerror=c.onload=null,c.removeAttribute(a),clearTimeout(p),d&&"load"!=d.type&&c.parentNode.removeChild(c),s(d),_)return _(d)};if(c.getAttribute(a)){var p=setTimeout(m.bind(null,void 0,{type:"timeout",target:c}),12e4);c.onerror=m.bind(null,c.onerror),c.onload=m.bind(null,c.onload)}else m(void 0,{type:"load",target:c});return e?document.head.insertBefore(c,e):i&&document.head.appendChild(c),c},f.f.css=function(_,d){var s=f.o(n,_)?n[_]:void 0;if(0!==s){if(s)d.push(s[2]);else if([].indexOf(_)>-1){var e=new Promise(function(d,e){s=n[_]=[d,e]});d.push(s[2]=e);var c=f.p+f.k(_),i=Error();t(_,c,function(d){if(f.o(n,_)&&(0!==(s=n[_])&&(n[_]=void 0),s)){if("load"!==d.type){var e=d&&d.type,c=d&&d.target&&d.target.src;i.message="Loading css chunk "+_+" failed.\n("+e+": "+c+")",i.name="ChunkLoadError",i.type=e,i.request=c,s[1](i)}else s[0]()}})}else n[_]=0}}}();</script><script defer="defer" src="/module-tools/static/js/lib-react.87879e53.js"></script><script defer="defer" src="/module-tools/static/js/lib-lodash.20527186.js"></script><script defer="defer" src="/module-tools/static/js/lib-polyfill.a99fdfae.js"></script><script defer="defer" src="/module-tools/static/js/lib-router.65b37e4a.js"></script><script defer="defer" src="/module-tools/static/js/defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be.7070a8dd.js"></script><script defer="defer" src="/module-tools/static/js/main.42725889.js"></script><link href="/module-tools/static/css/defaultVendors~docs_en_api_config_build-config_md~docs_en_api_config_build-preset_mdx~docs_en~2cd1be.71af0621.css" rel="stylesheet"><link href="/module-tools/static/css/main.1e1c5ea3.css" rel="stylesheet"></head><body><div id="root"><div><header class="top-0 left-0 md:fixed w-full" style="z-index:var(--modern-z-index-nav);background:var(--modern-c-bg)"><div class="navContainer_cc721 modern-doc-nav px-6"><div class="container_cc721 flex justify-between items-center h-full"><div class="undefined"><a href="/module-tools/en" class="flex items-center w-full h-full text-base font-semibold transition-opacity duration-300 hover:opacity-60"><span>Module Tools</span></a></div><div class="undefined flex flex-1 justify-end items-center"><div class="leftNav_cc721"><div class="menu h-14"></div></div><div class="rightNav_cc721"><div class="flex sm:flex-1 items-center sm:pl-4 sm:pr-2"><div class="navSearchButton_22838"><button><svg width="18" height="24" viewBox="0 0 32 32" hight="18"><path fill="var(--modern-c-gray)" d="m29 27.586-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9 9.01 9.01 0 0 1-9-9Z"></path></svg><p class="searchWord_22838">Search Docs</p><div><span>⌘</span><span>K</span></div></button></div><div class="mobileNavSearchButton_22838"><svg width="24" height="24" viewBox="0 0 32 32"><path fill="var(--modern-c-gray)" d="m29 27.586-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9 9.01 9.01 0 0 1-9-9Z"></path></svg></div></div><div class="menu h-14"><a class="link_2a8f5 cursor-pointer" target="" href="/module-tools/en/guide/intro/welcome.html"><div class="singleItem_cc721 text-sm font-medium mx-1.5 px-3 py-2">Guide</div></a><a class="link_2a8f5 cursor-pointer" target="" href="/module-tools/en/api/index.html"><div class="singleItem_cc721 activeItem_cc721 text-sm font-medium mx-1.5 px-3 py-2">API</div></a><a class="link_2a8f5 cursor-pointer" target="" href="/module-tools/en/plugins/guide/getting-started.html"><div class="singleItem_cc721 text-sm font-medium mx-1.5 px-3 py-2">Plugins</div></a><div class="mx-3 last:mr-0"><div class="relative flex-center h-14"><button class="nav-menu-group-button flex-center items-center font-medium text-sm text-text-1 hover:text-text-2 transition-colors duration-200"><span class="text-sm font-medium" style="margin-right:2px">v2.25.1</span><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div class="nav-menu-group-content absolute mx-0.8 transition-opacity duration-300" style="opacity:0;visibility:hidden;right:0;top:52px"><div class="p-3 pr-2 w-full h-full max-h-100vh whitespace-nowrap" style="box-shadow:var(--modern-shadow-3);z-index:100;border:1px solid var(--modern-c-divider-light);border-radius:2rem;background:var(--modern-c-bg)"><div><div class="font-medium my-1"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/module-tools/CHANGELOG.md" target="_blank" rel="noopener noreferrer" class="link_2a8f5 "><div class="rounded-2xl hover:bg-mute" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><div class="flex"><span>Changelog</span></div></div></a></div></div><div><div class="font-medium my-1"><a href="https://modernjs.dev/en/community/contributing-guide.html" target="_blank" rel="noopener noreferrer" class="link_2a8f5 "><div class="rounded-2xl hover:bg-mute" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><div class="flex"><span>Contributing</span></div></div></a></div></div></div></div></div></div></div><div class="flex-center flex-row"><div class="translation menu-item_cc721 flex text-sm font-bold items-center px-3 py-2"><div><div class="relative flex-center h-14"><button class="nav-menu-group-button flex-center items-center font-medium text-sm text-text-1 hover:text-text-2 transition-colors duration-200"><span class="text-sm font-medium" style="margin-right:2px"><svg width="18" height="18" viewBox="0 0 32 32" style="with:18px;height:18px"><path fill="currentColor" d="M27.85 29H30l-6-15h-2.35l-6 15h2.15l1.6-4h6.85zm-7.65-6 2.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 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div class="nav-menu-group-content absolute mx-0.8 transition-opacity duration-300" style="opacity:0;visibility:hidden;right:0;top:52px"><div class="p-3 pr-2 w-full h-full max-h-100vh whitespace-nowrap" style="box-shadow:var(--modern-shadow-3);z-index:100;border:1px solid var(--modern-c-divider-light);border-radius:2rem;background:var(--modern-c-bg)"><div><div class="font-medium my-1"><a class="link_2a8f5 cursor-pointer" target="" href="/module-tools/api/config/build-config.html"><div class="rounded-2xl hover:bg-mute" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><div class="flex"><span>简体中文</span></div></div></a></div></div><div><div class="rounded-2xl my-1" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><span class="text-brand">English</span></div></div></div></div></div></div></div><div class="mx-2"><div class="md:mr-2 modern-nav-appearance"><div class="p-1 border border-solid border-gray-300 text-gray-400 cursor-pointer rounded-md hover:border-gray-600 hover:text-gray-600 dark:hover:border-gray-200 dark:hover:text-gray-200 transition-all duration-300"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" viewBox="0 0 24 24" width="18" height="18" fill="currentColor"><path d="M12 18c-3.3 0-6-2.7-6-6s2.7-6 6-6 6 2.7 6 6-2.7 6-6 6zm0-10c-2.2 0-4 1.8-4 4s1.8 4 4 4 4-1.8 4-4-1.8-4-4-4zM12 4c-.6 0-1-.4-1-1V1c0-.6.4-1 1-1s1 .4 1 1v2c0 .6-.4 1-1 1zM12 24c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1s1 .4 1 1v2c0 .6-.4 1-1 1zM5.6 6.6c-.3 0-.5-.1-.7-.3L3.5 4.9c-.4-.4-.4-1 0-1.4s1-.4 1.4 0l1.4 1.4c.4.4.4 1 0 1.4-.1.2-.4.3-.7.3zM19.8 20.8c-.3 0-.5-.1-.7-.3l-1.4-1.4c-.4-.4-.4-1 0-1.4s1-.4 1.4 0l1.4 1.4c.4.4.4 1 0 1.4-.2.2-.5.3-.7.3zM3 13H1c-.6 0-1-.4-1-1s.4-1 1-1h2c.6 0 1 .4 1 1s-.4 1-1 1zM23 13h-2c-.6 0-1-.4-1-1s.4-1 1-1h2c.6 0 1 .4 1 1s-.4 1-1 1zM4.2 20.8c-.3 0-.5-.1-.7-.3-.4-.4-.4-1 0-1.4l1.4-1.4c.4-.4 1-.4 1.4 0s.4 1 0 1.4l-1.4 1.4c-.2.2-.4.3-.7.3zM18.4 6.6c-.3 0-.5-.1-.7-.3-.4-.4-.4-1 0-1.4l1.4-1.4c.4-.4 1-.4 1.4 0s.4 1 0 1.4l-1.4 1.4c-.2.2-.5.3-.7.3z"></path></svg></div></div></div><div class="social-links menu-item_4e3f0 flex-center relative"><div class="flex-center h-full gap-x-4 transition-colors duration-300 md:mr-2"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/module-tools" target="_blank" rel="noopener noreferrer" class="social-links"><div class="social-links-icon_4e3f0"><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 class="mobileNavMenu_cc721"><div class="navScreen_4eb57 " id="navScreen"><div class="container_4eb57"><div class="navMenu_4eb57"><div class="navMenuItem_4eb57 w-full"><a class="link_2a8f5 cursor-pointer" target="" href="/module-tools/en/guide/intro/welcome.html"><div class="singleItem_cc721 text-sm font-medium mx-1.5 px-3 py-2">Guide</div></a></div><div class="navMenuItem_4eb57 w-full"><a class="link_2a8f5 cursor-pointer" target="" href="/module-tools/en/api/index.html"><div class="singleItem_cc721 activeItem_cc721 text-sm font-medium mx-1.5 px-3 py-2">API</div></a></div><div class="navMenuItem_4eb57 w-full"><a class="link_2a8f5 cursor-pointer" target="" href="/module-tools/en/plugins/guide/getting-started.html"><div class="singleItem_cc721 text-sm font-medium mx-1.5 px-3 py-2">Plugins</div></a></div><div class="navMenuItem_4eb57 w-full"><div class="mx-3 last:mr-0"><div class=" navScreenMenuGroup_169ad relative"><button class="button_169ad"><span class="buttonSpan_169ad">v2.25.1</span><svg width="1em" height="1em" viewBox="0 0 32 32" class=" down_169ad "><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div><div class="items_169ad"><div><div class="py-1 font-medium"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/module-tools/CHANGELOG.md" target="_blank" rel="noopener noreferrer" class="link_2a8f5 "><div><div class="flex justify-center"><span>Changelog</span></div></div></a></div></div><div><div class="py-1 font-medium"><a href="https://modernjs.dev/en/community/contributing-guide.html" target="_blank" rel="noopener noreferrer" class="link_2a8f5 "><div><div class="flex justify-center"><span>Contributing</span></div></div></a></div></div></div></div></div></div></div></div><div class="flex-center flex-col gap-2"><div class="mt-2 navAppearance_4eb57 flex justify-center"></div><div class="undefined flex text-sm font-bold justify-center"><div class="mx-1.5 my-1"><div class=" navScreenMenuGroup_169ad relative"><button class="button_169ad"><span class="buttonSpan_169ad"><svg width="18" height="18" viewBox="0 0 32 32" style="width:18px;height:18px"><path fill="currentColor" d="M27.85 29H30l-6-15h-2.35l-6 15h2.15l1.6-4h6.85zm-7.65-6 2.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_169ad "><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div><div class="items_169ad"><div><div class="py-1 font-medium"><a class="link_2a8f5 cursor-pointer" target="" href="/module-tools/zh.html"><div><div class="flex justify-center"><span>简体中文</span></div></div></a></div></div><div><div class="p-1"><span class="text-brand">English</span></div></div></div></div></div></div></div><div class="social-links menu-item_4e3f0 flex-center relative"><div class="flex-center h-full gap-x-4 transition-colors duration-300 md:mr-2"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/module-tools" target="_blank" rel="noopener noreferrer" class="social-links"><div class="social-links-icon_4e3f0"><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><button class=" navHamburger_41e74 text-gray-500"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor"><circle cx="8" cy="16" r="2" fill="currentColor"></circle><circle cx="16" cy="16" r="2" fill="currentColor"></circle><circle cx="24" cy="16" r="2" fill="currentColor"></circle></svg></button></div></div></div></div></header><section><div class="docLayout_12c7d pt-0 md:mt-14"><div class="localNav_159b7"><button class="menu_159b7 flex-center"><div class="text-md mr-2"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M4 6h24v2H4zm0 18h24v2H4zm0-12h24v2H4zm0 6h24v2H4z"></path></svg></div><span class="text-sm">Menu</span></button></div><aside class="sidebar_3b941 modern-sidebar "><div class="mt-1 sidebarContent_3b941"><div class="modern-scrollbar" style="max-height:calc(100vh - var(--modern-nav-height) - 8px);overflow:scroll"><nav class="pb-6"><a class="link_2a8f5 menuLink_3b941 cursor-pointer" target="" href="/module-tools/en/api/index.html"><div class="menuItem_3b941 mt-1 py-1.5 px-3 block rounded-xl font-medium" style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;margin-left:0">Overview</div></a><section class="mt-1 block" style="margin-left:0"><div style="cursor:pointer" class="flex justify-between items-center rounded-xl menuItem_3b941"><h2 class="py-1 px-2 text-sm font-medium ml-1" style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis">Config</h2><div class="collapseContainer_3b941 p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="transition-opacity duration-500 ease-in-out" style="opacity:1"><div><a class="link_2a8f5 menuLink_3b941 cursor-pointer" target="" href="/module-tools/en/api/config/build-config.html"><div class="menuItemActive_3b941 mt-1 py-1.5 px-3 block rounded-xl font-medium" style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;margin-left:12px">buildConfig</div></a></div><div><a class="link_2a8f5 menuLink_3b941 cursor-pointer" target="" href="/module-tools/en/api/config/build-preset.html"><div class="menuItem_3b941 mt-1 py-1.5 px-3 block rounded-xl font-medium" style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;margin-left:12px">buildPreset</div></a></div><div><a class="link_2a8f5 menuLink_3b941 cursor-pointer" target="" href="/module-tools/en/api/config/design-system.html"><div class="menuItem_3b941 mt-1 py-1.5 px-3 block rounded-xl font-medium" style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;margin-left:12px">designSystem</div></a></div><div><a class="link_2a8f5 menuLink_3b941 cursor-pointer" target="" href="/module-tools/en/api/config/dev.html"><div class="menuItem_3b941 mt-1 py-1.5 px-3 block rounded-xl font-medium" style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;margin-left:12px">dev</div></a></div><div><a class="link_2a8f5 menuLink_3b941 cursor-pointer" target="" href="/module-tools/en/api/config/plugins.html"><div class="menuItem_3b941 mt-1 py-1.5 px-3 block rounded-xl font-medium" style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;margin-left:12px">plugins</div></a></div><div><a class="link_2a8f5 menuLink_3b941 cursor-pointer" target="" href="/module-tools/en/api/config/testing.html"><div class="menuItem_3b941 mt-1 py-1.5 px-3 block rounded-xl font-medium" style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;margin-left:12px">testing</div></a></div></div></div></section><section class="mt-1 block" style="margin-left:0"><div style="cursor:pointer" class="flex justify-between items-center rounded-xl menuItem_3b941"><h2 class="py-1 px-2 text-sm font-medium ml-1" style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis">Plugin API</h2><div class="collapseContainer_3b941 p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="transition-opacity duration-500 ease-in-out" style="opacity:1"><div><a class="link_2a8f5 menuLink_3b941 cursor-pointer" target="" href="/module-tools/en/api/plugin-api/plugin-hooks.html"><div class="menuItem_3b941 mt-1 py-1.5 px-3 block rounded-xl font-medium" style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;margin-left:12px">Plugin Hooks</div></a></div></div></div></section></nav></div></div></aside><div class="content_12c7d flex flex-shrink-0"><div class="w-full"><div class="modern-doc"><!--$--><h1 id="buildconfig" class="text-3xl mb-10 leading-10 tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#buildconfig">#</a>buildConfig</h1>
12
- <p class="my-4 leading-7"><code>buildConfig</code> is a configuration option that describes how to compile and generate build artifacts. It contains all the configurations related to the build process.</p>
13
- <ul class="list-disc pl-5 my-4 leading-7">
14
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>object | object[]</code></li>
15
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>undefined</code></li>
16
- </ul>
17
- <div class="modern-directive tip"><div class="modern-directive-title">TIP</div><div class="modern-directive-content"><p class="my-4 leading-7">
18
- Before start using <code>buildConfig</code>, please read the following documentation to understand its purpose:</p><ul class="list-disc pl-5 my-4 leading-7">
19
- <li class="[&amp;:not(:first-child)]:mt-2"><a href="/module-tools/en/guide/basic/modify-output-product.html" class="link_2d294 undefined">Modifying Output Artifacts</a></li>
20
- <li class="[&amp;:not(:first-child)]:mt-2"><a href="/module-tools/en/guide/advance/in-depth-about-build.html" class="link_2d294 undefined">In-Depth Understanding of the Build Process</a></li>
21
- </ul></div></div>
22
- <h2 id="alias" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#alias">#</a>alias</h2>
23
- <ul class="list-disc pl-5 my-4 leading-7">
24
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>Record&lt;string, string&gt; | Function</code></li>
25
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>{&#x27;@&#x27;: &#x27;src&#x27;,}</code></li>
26
- </ul>
27
- <div class="modern-directive tip"><div class="modern-directive-title">TIP</div><div class="modern-directive-content"><p class="my-4 leading-7">
28
- For TypeScript projects, you only need to configure <a href="https://www.typescriptlang.org/tsconfig#paths" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">compilerOptions.paths</a> in <code>tsconfig.json</code>, Module Tools will automatically recognize the alias in <code>tsconfig.json</code>, so there is no need to configure the <code>alias</code>field additionally.</p></div></div>
29
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> alias: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> &#x27;@common&#x27;: &#x27;. /src/common&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
30
- <p class="my-4 leading-7">After the above configuration is done, if <code>@common/Foo.tsx</code> is referenced in the code, it will map to the <code>&lt;root&gt;/src/common/Foo.tsx</code> path.</p>
31
- <p class="my-4 leading-7">When the value of <code>alias</code> is defined as a function, you can accept the pre-defined alias object and modify it.</p>
32
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> alias: alias =&gt; {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> alias[&#x27;@common&#x27;] = &#x27;. /src/common&#x27;;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
33
- <p class="my-4 leading-7">It is also possible to return a new object as the final result in the function, which will override the pre-defined alias object.</p>
34
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> alias: alias =&gt; {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> return {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> &#x27;@common&#x27;: &#x27;. /src/common&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> };</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
35
- <h2 id="asset" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#asset">#</a>asset</h2>
36
- <p class="my-4 leading-7">Contains configuration related to static assets.</p>
37
- <h2 id="assetpath" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#assetpath">#</a>asset.path</h2>
38
- <p class="my-4 leading-7">Static resource output path, will be based on <a href="/module-tools/en/api/config/build-config.html#outDir" class="link_2d294 undefined">outDir</a></p>
39
- <ul class="list-disc pl-5 my-4 leading-7">
40
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>string</code></li>
41
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>assets</code></li>
42
- </ul>
43
- <h2 id="assetlimit" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#assetlimit">#</a>asset.limit</h2>
44
- <p class="my-4 leading-7">Used to set the threshold for static assets to be automatically inlined as base64.</p>
45
- <p class="my-4 leading-7">By default, Module Tools will inline assets such as images, fonts and media smaller than 10KB during bundling. They are Base64 encoded and inlined in the bundles, eliminating the need for separate HTTP requests.</p>
46
- <p class="my-4 leading-7">You can adjust this threshold by modifying the <code>limit</code> config.</p>
47
- <ul class="list-disc pl-5 my-4 leading-7">
48
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>number</code></li>
49
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>10 * 1024</code></li>
50
- </ul>
51
- <p class="my-4 leading-7">For example, set <code>limit</code> to <code>0</code> to avoid assets inlining:</p>
52
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> asset: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> limit: 0,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
53
- <h2 id="assetpublicpath" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#assetpublicpath">#</a>asset.publicPath</h2>
54
- <p class="my-4 leading-7">The CDN prefix given to unlinked resources when packaging</p>
55
- <ul class="list-disc pl-5 my-4 leading-7">
56
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>string</code></li>
57
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>undefined</code></li>
58
- </ul>
59
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> asset: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> publicPath: &#x27;https://xxx/&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
60
- <p class="my-4 leading-7">At this point, all static resources will be prefixed with <code>https://xxx/</code></p>
61
- <h2 id="assetsvgr" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#assetsvgr">#</a>asset.svgr</h2>
62
- <p class="my-4 leading-7">Packaged to handle svg as a React component, options reference <a href="https://react-svgr.com/docs/options/" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">svgr</a>, plus support for two configuration items <code>include</code> and <code>exclude</code> to match the svg file to be handled</p>
63
- <ul class="list-disc pl-5 my-4 leading-7">
64
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>boolean | object</code></li>
65
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>false</code></li>
66
- </ul>
67
- <p class="my-4 leading-7">When svgr feature is enabled, you can use svg as a component using the default export.</p>
68
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="index.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>index.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>// true</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>import Logo from &#x27;./logo.svg&#x27;;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span></span></div></div><div><div style="display:inline-block;margin-left:16px"><span>export default () =&gt; &lt;Logo /&gt;;</span></div></div><br/></code></div></div></div></div>
69
- <div class="modern-directive warning"><div class="modern-directive-title">WARNING</div><div class="modern-directive-content"><p class="my-4 leading-7">
70
- The following usage is not currently supported:</p><div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="index.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>index.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>import { ReactComponent } from &#x27;./logo.svg&#x27;;</span></div></div><br/></code></div></div></div></div></div></div>
71
- <p class="my-4 leading-7">When enabled, the type of svg used can be modified by adding a type definition to the <code>modern-app-env.d.ts</code> file:</p>
72
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern-app-env.d.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern-app-env.d.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>declare module &#x27;*.svg&#x27; {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> const src: React.FunctionComponent&lt;React.SVGProps&lt;SVGSVGElement&gt;&gt;;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> export default src;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>}</span></div></div><div><div style="display:inline-block;margin-left:16px"><span></span></div></div><div><div style="display:inline-block;margin-left:16px"><span>/// &lt;reference types=&#x27;@modern-js/module-tools/types&#x27; /&gt;</span></div></div><br/></code></div></div></div></div>
73
- <h2 id="assetsvgrinclude" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#assetsvgrinclude">#</a>asset.svgr.include</h2>
74
- <p class="my-4 leading-7">Set the matching svg file</p>
75
- <ul class="list-disc pl-5 my-4 leading-7">
76
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>string | RegExp | (string | RegExp)[]</code></li>
77
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>/\.svg$/</code></li>
78
- </ul>
79
- <h2 id="assetsvgrexclude" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#assetsvgrexclude">#</a>asset.svgr.exclude</h2>
80
- <p class="my-4 leading-7">Set unmatched svg files</p>
81
- <ul class="list-disc pl-5 my-4 leading-7">
82
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>string | RegExp | (string | RegExp)[]</code></li>
83
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>undefined</code></li>
84
- </ul>
85
- <h2 id="autoexternal" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#autoexternal">#</a>autoExternal</h2>
86
- <p class="my-4 leading-7">Automatically externalize project dependencies and peerDependencies and not package them into the final bundle</p>
87
- <ul class="list-disc pl-5 my-4 leading-7">
88
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>boolean | object</code></li>
89
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>true</code></li>
90
- </ul>
91
- <p class="my-4 leading-7">When we want to turn off the default handling behavior for third-party dependencies, we can do so by:</p>
92
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> autoExternal: false,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
93
- <p class="my-4 leading-7">This way the dependencies under <code>&quot;dependencies&quot;</code> and <code>&quot;peerDependencies&quot;</code> will be packaged. If you want to turn off the processing of only one of these dependencies, you can use the
94
- <code>buildConfig.autoExternal</code> in the form of an object.</p>
95
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> autoExternal: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> dependencies: false,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> peerDependencies: false,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
96
- <h2 id="autoexternaldependencies" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#autoexternaldependencies">#</a>autoExternal.dependencies</h2>
97
- <p class="my-4 leading-7">Whether or not the dep dependencies of the external project are needed</p>
98
- <ul class="list-disc pl-5 my-4 leading-7">
99
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>boolean</code></li>
100
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>true</code></li>
101
- </ul>
102
- <h2 id="autoexternalpeerdependencies" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#autoexternalpeerdependencies">#</a>autoExternal.peerDependencies</h2>
103
- <p class="my-4 leading-7">Whether to require peerDep dependencies for external projects</p>
104
- <ul class="list-disc pl-5 my-4 leading-7">
105
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>boolean</code></li>
106
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>true</code></li>
107
- </ul>
108
- <h2 id="buildtype" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#buildtype">#</a>buildType</h2>
109
- <p class="my-4 leading-7">The build type, <code>bundle</code> will package your code, <code>bundleless</code> will only do the code conversion</p>
110
- <ul class="list-disc pl-5 my-4 leading-7">
111
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>&#x27;bundle&#x27; | &#x27;bundleless&#x27;</code></li>
112
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>bundle</code></li>
113
- </ul>
114
- <h2 id="copy" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#copy">#</a>copy</h2>
115
- <p class="my-4 leading-7">Copies the specified file or directory into the build output directory</p>
116
- <ul class="list-disc pl-5 my-4 leading-7">
117
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>object[]</code></li>
118
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>[]</code></li>
119
- </ul>
120
- <div class="ch-codeblock not-prose "><div class="ch-code" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> copy: [{ from: &#x27;. /src/assets&#x27;, to: &#x27;&#x27; }],</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div>
121
- <p class="my-4 leading-7">Reference for array settings: <a href="https://github.com/webpack-contrib/copy-webpack-plugin#patterns" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">copy-webpack-plugin patterns</a></p>
122
- <h2 id="copypatterns" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#copypatterns">#</a>copy.patterns</h2>
123
- <ul class="list-disc pl-5 my-4 leading-7">
124
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>CopyPattern[]</code></li>
125
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>[]</code></li>
126
- </ul>
127
- <div class="ch-codeblock not-prose "><div class="ch-code" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>interface CopyPattern {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> from: string;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> to?: string;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> context?: string;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> globOptions?: globby.GlobbyOptions;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>}</span></div></div><br/></code></div></div>
128
- <h2 id="copyoptions" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#copyoptions">#</a>copy.options</h2>
129
- <ul class="list-disc pl-5 my-4 leading-7">
130
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>:</li>
131
- </ul>
132
- <div class="ch-codeblock not-prose "><div class="ch-code" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>type Options = {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> concurrency?: number;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> enableCopySync?: boolean;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div>
133
- <ul class="list-disc pl-5 my-4 leading-7">
134
- <li class="[&amp;:not(:first-child)]:mt-2">
135
- <p class="my-4 leading-7"><strong class="font-semibold">Default</strong>: <code>{ concurrency: 100, enableCopySync: false }</code></p>
136
- </li>
137
- <li class="[&amp;:not(:first-child)]:mt-2">
138
- <p class="my-4 leading-7"><code>concurrency</code>: Specifies how many copy tasks to execute in parallel.</p>
139
- </li>
140
- <li class="[&amp;:not(:first-child)]:mt-2">
141
- <p class="my-4 leading-7"><code>enableCopySync</code>: Uses <a href="https://github.com/jprichardson/node-fs-extra/blob/master/lib/copy/copy-sync.js" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined"><code>fs.copySync</code></a> by default, instead of <a href="https://github.com/jprichardson/node-fs-extra/blob/master/lib/copy/copy.js" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined"><code>fs.copy</code></a>.</p>
142
- </li>
143
- </ul>
144
- <h2 id="define" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#define">#</a>define</h2>
145
- <p class="my-4 leading-7">Define global variables that will be injected into the code</p>
146
- <ul class="list-disc pl-5 my-4 leading-7">
147
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>Record&lt;string, string&gt;</code></li>
148
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>{}</code></li>
149
- </ul>
150
- <p class="my-4 leading-7">Since the <code>define</code> function is implemented by global text replacement, you need to ensure that the global variable values are strings. A safer approach is to convert the value of each global variable to a string, using <code>JSON.stringify</code>, as follows.</p>
151
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> define: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> VERSION: JSON.stringify(&#x27;1.0&#x27;),</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
152
- <div class="modern-directive tip"><div class="modern-directive-title">TIP</div><div class="modern-directive-content"><p class="my-4 leading-7">
153
- To prevent excessive global replacement substitution, it is recommended that the following two principles be followed when using</p><ul class="list-disc pl-5 my-4 leading-7">
154
- <li class="[&amp;:not(:first-child)]:mt-2">Use upper case for global constants</li>
155
- <li class="[&amp;:not(:first-child)]:mt-2">Customize the prefix and suffix of global constants to ensure uniqueness</li>
156
- </ul></div></div>
157
- <!-- -->
158
- <h2 id="dts" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#dts">#</a>dts</h2>
159
- <p class="my-4 leading-7">The dts file generates the relevant configuration, by default it generates.</p>
160
- <ul class="list-disc pl-5 my-4 leading-7">
161
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>false | object</code></li>
162
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>:</li>
163
- </ul>
164
- <div class="ch-codeblock not-prose "><div class="ch-code" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>{</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> abortOnError: true,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> distPath: &#x27;./&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> only: false,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> tsconfigPath: &#x27;./tsconfig.json&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>}</span></div></div><br/></code></div></div>
165
- <h2 id="dtsabortonerror" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#dtsabortonerror">#</a>dts.abortOnError</h2>
166
- <p class="my-4 leading-7">Whether to allow the build to succeed if a type error occurs.</p>
167
- <ul class="list-disc pl-5 my-4 leading-7">
168
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>boolean</code></li>
169
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>true</code></li>
170
- </ul>
171
- <p class="my-4 leading-7"><strong class="font-semibold">By default, type errors will cause the build to fail</strong>. When <code>abortOnError</code> is set to <code>false</code>, the build will still succeed even if there are type issues in the code:</p>
172
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> dts: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> abortOnError: false,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
173
- <div class="modern-directive warning"><div class="modern-directive-title">WARNING</div><div class="modern-directive-content"><p class="my-4 leading-7">
174
- When this configuration is disabled, there is no guarantee that the type files will be generated correctly. In <code>buildType: &#x27;bundle&#x27;</code>, which is the bundle mode, type files will not be generated.</p></div></div>
175
- <h2 id="dtsdistpath" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#dtsdistpath">#</a>dts.distPath</h2>
176
- <p class="my-4 leading-7">The output path of the dts file, based on <a href="/module-tools/en/api/config/build-config.html#outDir" class="link_2d294 undefined">outDir</a></p>
177
- <ul class="list-disc pl-5 my-4 leading-7">
178
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>string</code></li>
179
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>. /types</code></li>
180
- </ul>
181
- <h2 id="dtsonly" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#dtsonly">#</a>dts.only</h2>
182
- <p class="my-4 leading-7">Generate only dts files, not js files</p>
183
- <ul class="list-disc pl-5 my-4 leading-7">
184
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>boolean</code></li>
185
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>false</code></li>
186
- </ul>
187
- <h2 id="dtsrespectexternal" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#dtsrespectexternal">#</a>dts.respectExternal</h2>
188
- <p class="my-4 leading-7">When set to <code>false</code>, the type of third-party packages will be excluded from the bundle, when set to <code>true</code>, it will determine whether third-party types need to be bundled based on <a href="#externals" class="link_2d294 undefined">externals</a>.</p>
189
- <p class="my-4 leading-7">When bundle d.ts, export is not analyzed, so any third-party package type you use may break your build, which is obviously uncontrollable.
190
- So we can avoid it with this configuration.</p>
191
- <ul class="list-disc pl-5 my-4 leading-7">
192
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>boolean</code></li>
193
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>true</code></li>
194
- </ul>
195
- <h2 id="dtstsconfigpath" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#dtstsconfigpath">#</a>dts.tsconfigPath</h2>
196
- <p class="my-4 leading-7">Path to the tsconfig file</p>
197
- <ul class="list-disc pl-5 my-4 leading-7">
198
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>string</code></li>
199
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>. /tsconfig.json</code></li>
200
- </ul>
201
- <h2 id="esbuildoptions" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#esbuildoptions">#</a>esbuildOptions</h2>
202
- <p class="my-4 leading-7">Directly modify <a href="https://esbuild.github.io/api/" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">esbuild configuration</a></p>
203
- <ul class="list-disc pl-5 my-4 leading-7">
204
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>Function</code></li>
205
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>c =&gt; c</code></li>
206
- </ul>
207
- <p class="my-4 leading-7">For example, if we need to modify the file extension of the generated files:</p>
208
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> esbuildOptions: options =&gt; {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> options.outExtension = { &#x27;.js&#x27;: &#x27;.mjs&#x27; };</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> return options;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
209
- <div class="modern-directive tip"><div class="modern-directive-title">TIP</div><div class="modern-directive-content"><p class="my-4 leading-7">
210
- We have done many extensions based on the original esbuild build. Therefore, when using this configuration, pay attention to the following:</p><ol class="list-decimal pl-5 my-4 leading-7">
211
- <li class="[&amp;:not(:first-child)]:mt-2">Prefer to use the configuration we provide. For example, esbuild does not support target: &#x27;es5&#x27;, but we support this scenario internally using swc. Setting target: &#x27;es5&#x27; through esbuildOptions will result in an error.</li>
212
- <li class="[&amp;:not(:first-child)]:mt-2">Currently, we use enhanced-resolve internally to replace esbuild&#x27;s resolve algorithm, so modifying esbuild resolve-related configurations is invalid. We plan to switch back in the future.</li>
213
- <li class="[&amp;:not(:first-child)]:mt-2">When using esbuild plugins, you need to add the plugins to the beginning of the plugins array because we also intervene in the entire build process through an esbuild plugin internally. Therefore, custom plugins need to be registered first.</li>
214
- </ol></div></div>
215
- <h2 id="externalhelpers" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#externalhelpers">#</a>externalHelpers</h2>
216
- <p class="my-4 leading-7">By default, the output JS code may depend on helper functions to support the target environment or output format, and these helper functions will be inlined in the file that requires it.</p>
217
- <p class="my-4 leading-7">When using SWC Transform for code transformation, you can enable the <code>externalHelpers</code> configuration to convert inline helper functions to import them from the external module <code>@swc/helpers</code>.</p>
218
- <ul class="list-disc pl-5 my-4 leading-7">
219
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>boolean</code></li>
220
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>false</code></li>
221
- </ul>
222
- <p class="my-4 leading-7">Below is a comparison of the product changes before and after using this configuration.</p>
223
- <p class="my-4 leading-7">Before enable:</p>
224
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="./dist/index.js" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5">./dist/</span>index.js</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>// helper function</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> // ...</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>}</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>// helper function</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>function _async_to_generator(fn) {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> return function () {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> // use asyncGeneratorStep</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> // ...</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> };</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>}</span></div></div><div><div style="display:inline-block;margin-left:16px"><span></span></div></div><div><div style="display:inline-block;margin-left:16px"><span>// your code</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>export var yourCode = function () {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> // use _async_to_generator</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
225
- <p class="my-4 leading-7">After enabled:</p>
226
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="./dist/index.js" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5">./dist/</span>index.js</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>// helper functions imported from @swc/helpers</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>import { _ as _async_to_generator } from &#x27;@swc/helpers/_/_async_to_generator&#x27;;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span></span></div></div><div><div style="display:inline-block;margin-left:16px"><span>// your code</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>export var yourCode = function () {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> // use _async_to_generator</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
227
- <h2 id="externals" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#externals">#</a>externals</h2>
228
- <p class="my-4 leading-7">Configure external dependencies that will not be packaged into the final bundle</p>
229
- <ul class="list-disc pl-5 my-4 leading-7">
230
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>:</li>
231
- </ul>
232
- <div class="ch-codeblock not-prose "><div class="ch-code" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>type External = (string | RegExp)[];</span></div></div><br/></code></div></div>
233
- <ul class="list-disc pl-5 my-4 leading-7">
234
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>[]</code></li>
235
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Build Type</strong>: <code>Only supported for buildType: &#x27;bundle&#x27;</code></li>
236
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Example</strong>:</li>
237
- </ul>
238
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> // do not bundle React</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> externals: [&#x27;react&#x27;],</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
239
- <h2 id="format" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#format">#</a>format</h2>
240
- <p class="my-4 leading-7">Used to set the output format of JavaScript files. The options <code>iife</code> and <code>umd</code> only take effect when <code>buildType</code> is <code>bundle</code>.</p>
241
- <ul class="list-disc pl-5 my-4 leading-7">
242
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>&#x27;esm&#x27; | &#x27;cjs&#x27; | &#x27;iife&#x27; | &#x27;umd&#x27;</code></li>
243
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>cjs</code></li>
244
- </ul>
245
- <h3 id="format-esm" class="mt-10 mb-2 leading-7 text-xl title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#format-esm">#</a>format: &#x27;esm&#x27;</h3>
246
- <p class="my-4 leading-7"><code>esm</code> stands for &quot;ECMAScript module&quot; and requires the runtime environment to support import and export syntax.</p>
247
- <ul class="list-disc pl-5 my-4 leading-7">
248
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Example</strong>:</li>
249
- </ul>
250
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> format: &#x27;esm&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
251
- <h3 id="format-cjs" class="mt-10 mb-2 leading-7 text-xl title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#format-cjs">#</a>format: &#x27;cjs&#x27;</h3>
252
- <p class="my-4 leading-7"><code>cjs</code> stands for &quot;CommonJS&quot; and requires the runtime environment to support exports, require, and module syntax. This format is commonly used in Node.js environments.</p>
253
- <ul class="list-disc pl-5 my-4 leading-7">
254
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Example</strong>:</li>
255
- </ul>
256
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> format: &#x27;cjs&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
257
- <h3 id="format-iife" class="mt-10 mb-2 leading-7 text-xl title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#format-iife">#</a>format: &#x27;iife&#x27;</h3>
258
- <p class="my-4 leading-7"><code>iife</code> stands for &quot;immediately-invoked function expression&quot; and wraps the code in a function expression to ensure that any variables in the code do not accidentally conflict with variables in the global scope. This format is commonly used in browser environments.</p>
259
- <ul class="list-disc pl-5 my-4 leading-7">
260
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Example</strong>:</li>
261
- </ul>
262
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> format: &#x27;iife&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
263
- <h3 id="format-umd" class="mt-10 mb-2 leading-7 text-xl title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#format-umd">#</a>format: &#x27;umd&#x27;</h3>
264
- <p class="my-4 leading-7"><code>umd</code> stands for &quot;Universal Module Definition&quot; and is used to run modules in different environments such as browsers and Node.js. Modules in UMD format can be used in various environments, either as global variables or loaded as modules using module loaders like RequireJS.</p>
265
- <ul class="list-disc pl-5 my-4 leading-7">
266
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Example</strong>:</li>
267
- </ul>
268
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> format: &#x27;umd&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
269
- <h2 id="input" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#input">#</a>input</h2>
270
- <p class="my-4 leading-7">Specify the entry file for the build, in the form of an array that can specify the directory</p>
271
- <ul class="list-disc pl-5 my-4 leading-7">
272
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>:</li>
273
- </ul>
274
- <div class="ch-codeblock not-prose "><div class="ch-code" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>type Input =</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> | string[];</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> | {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> [name: string]: string;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> }</span></div></div><br/></code></div></div>
275
- <ul class="list-disc pl-5 my-4 leading-7">
276
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>[&#x27;src/index.ts&#x27;]</code> in <code>bundle</code> mode, <code>[&#x27;src&#x27;]</code> in <code>bundleless</code> mode</li>
277
- </ul>
278
- <p class="my-4 leading-7"><strong class="font-semibold">Array usage:</strong></p>
279
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> input: [&#x27;src/index.ts&#x27;, &#x27;src/index2.ts&#x27;],</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
280
- <p class="my-4 leading-7"><strong class="font-semibold">Object usage:</strong></p>
281
- <p class="my-4 leading-7">When you need to modify the output file name in bundle mode, you can use an object configuration.</p>
282
- <p class="my-4 leading-7"><strong class="font-semibold">The key of the object is the file name of the output, and the value is the file path of the source code.</strong></p>
283
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> format: &#x27;esm&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> input: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> &#x27;index.esm&#x27;: &#x27;./src/index.ts&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
284
- <h2 id="jsx" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#jsx">#</a>jsx</h2>
285
- <p class="my-4 leading-7">Specify the compilation method for JSX, which by default supports React 17 and higher versions and automatically injects JSX runtime code.</p>
286
- <ul class="list-disc pl-5 my-4 leading-7">
287
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>automatic | transform</code></li>
288
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>automatic</code></li>
289
- </ul>
290
- <p class="my-4 leading-7">If you need to support React 16, you can set <code>jsx</code> to <code>transform</code>:</p>
291
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> jsx: &#x27;transform&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
292
- <div class="modern-directive tip"><div class="modern-directive-title">TIP</div><div class="modern-directive-content"><p class="my-4 leading-7">
293
- For more information about JSX Transform, you can refer to the following links:</p><ul class="list-disc pl-5 my-4 leading-7">
294
- <li class="[&amp;:not(:first-child)]:mt-2"><a href="https://legacy.reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">React Blog - Introducing the New JSX Transform</a>.</li>
295
- <li class="[&amp;:not(:first-child)]:mt-2"><a href="https://esbuild.github.io/api/#jsx" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">esbuild - JSX</a>.
296
- :::</li>
297
- </ul><h2 id="metafile" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#metafile">#</a>metafile</h2><p class="my-4 leading-7">This option is used for build analysis. When enabled, esbuild will generate metadata about the build in JSON format.</p><ul class="list-disc pl-5 my-4 leading-7">
298
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>boolean</code></li>
299
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>false</code></li>
300
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Build Type</strong>: <code>Only supported for buildType: &#x27;bundle&#x27;</code></li>
301
- </ul><p class="my-4 leading-7">To enable <code>metafile</code> generation:</p><div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildType: &#x27;bundle&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> metafile: true,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div><p class="my-4 leading-7">After executing the build, a <code>metafile-[xxx].json</code> file will be generated in the output directory. You can use tools like <a href="https://esbuild.github.io/analyze/" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">esbuild analyze</a> and <a href="https://bundle-buddy.com/esbuild" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">bundle-buddy</a> for visual analysis.</p><h2 id="minify" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#minify">#</a>minify</h2><p class="my-4 leading-7">Use esbuild or terser to compress code, also pass <a href="https://github.com/terser/terser#minify-options" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">terserOptions</a></p><ul class="list-disc pl-5 my-4 leading-7">
302
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>&#x27;terser&#x27; | &#x27;esbuild&#x27; | false | object</code></li>
303
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>false</code></li>
304
- </ul><div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> minify: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> compress: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> drop_console: true,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div><h2 id="outdir" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#outdir">#</a>outDir</h2><p class="my-4 leading-7">Specifies the output directory of the build</p><ul class="list-disc pl-5 my-4 leading-7">
305
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>string</code></li>
306
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>dist</code></li>
307
- </ul><h2 id="platform" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#platform">#</a>platform</h2><p class="my-4 leading-7">Generates code for the node environment by default, you can also specify <code>browser</code> which will generate code for the browser environment</p><ul class="list-disc pl-5 my-4 leading-7">
308
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>&#x27;browser&#x27; | &#x27;node&#x27;</code></li>
309
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>node</code></li>
310
- </ul><h2 id="redirect" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#redirect">#</a>redirect</h2><p class="my-4 leading-7">In <code>buildType: &#x27;bundleless&#x27;</code> build mode, the reference path is redirected to ensure that it points to the correct product, e.g:</p><ul class="list-disc pl-5 my-4 leading-7">
311
- <li class="[&amp;:not(:first-child)]:mt-2"><code>import &#x27;. /index.less&#x27;</code> will be rewritten to <code>import &#x27;. /index.css&#x27;</code></li>
312
- <li class="[&amp;:not(:first-child)]:mt-2"><code>import icon from &#x27;. /close.svg&#x27;</code> would be rewritten as <code>import icon from &#x27;... /asset/close.svg&#x27;</code> to <code>import icon from &#x27;. /asset/close.svg&#x27;</code> (depending on the situation)</li>
313
- </ul><p class="my-4 leading-7">In some scenarios, you may not need these functions, then you can turn it off with this configuration, and its reference path will not be changed after turning it off.</p><div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> redirect: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> alias: false, // Turn off modifying alias paths</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> style: false, // Turn off modifying the path to the style file</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> asset: false, // Turn off modifying the path to the resource file</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div><h2 id="sideeffects" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#sideeffects">#</a>sideEffects</h2><p class="my-4 leading-7">Module sideEffects</p><ul class="list-disc pl-5 my-4 leading-7">
314
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>RegExg[] | (filePath: string, isExternal: boolean) =&gt; boolean | boolean</code></li>
315
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>undefined</code></li>
316
- </ul><p class="my-4 leading-7">Normally, we configure the module&#x27;s side effects via the sideEffects field in package.json, but in some cases, The package.json of a third-party package is unreliable.Such as when we reference a third-party package style file</p><div class="ch-codeblock not-prose "><div class="ch-code" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>import &#x27;other-package/dist/index.css&#x27;;</span></div></div><br/></code></div></div><p class="my-4 leading-7">But the package.json of this third-party package does not have the style file configured in the sideEffects</p><div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="other-package/package.json" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5">other-package/</span>package.json</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>{</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> &quot;sideEffects&quot;: [&quot;dist/index.js&quot;]</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>}</span></div></div><br/></code></div></div></div></div><p class="my-4 leading-7">At the same time you set <a href="#styleinject" class="link_2d294 undefined">style.inject</a> to <code>true</code> and you will see a warning message like this in the console</p><div class="ch-codeblock not-prose "><div class="ch-code" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>[LIBUILD:ESBUILD_WARN] Ignoring this import because &quot;other-package/dist/index.css&quot; was marked as having no side effects</span></div></div><br/></code></div></div><p class="my-4 leading-7">At this point, you can use this configuration item to manually configure the module&#x27;s <code>&quot;sideEffects&quot;</code> to support regular and functional forms.</p><div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> sideEffects: [/\.css$/],</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> // or</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> // sideEffects: (filePath, isExternal) =&gt; /\.css$/.test(filePath),</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div><p class="my-4 leading-7">:::tip
317
- After adding this configuration, the sideEffects field in package.json will no longer be read when packaging</p></div></div>
318
- <h2 id="sourcedir" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#sourcedir">#</a>sourceDir</h2>
319
- <p class="my-4 leading-7">Specify the source directory of the build, default is <code>src</code>, which is used to generate the corresponding product directory based on the source directory structure when building <code>bundleless</code>.</p>
320
- <ul class="list-disc pl-5 my-4 leading-7">
321
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>string</code></li>
322
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>src</code></li>
323
- </ul>
324
- <h2 id="sourcemap" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#sourcemap">#</a>sourceMap</h2>
325
- <p class="my-4 leading-7">Whether to generate sourceMap or not</p>
326
- <ul class="list-disc pl-5 my-4 leading-7">
327
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>boolean | &#x27;inline&#x27; | &#x27;external&#x27;</code></li>
328
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>false</code></li>
329
- </ul>
330
- <h2 id="sourcetype" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#sourcetype">#</a>sourceType</h2>
331
- <p class="my-4 leading-7">Sets the format of the source code. By default, the source code will be treated as EsModule. When the source code is using CommonJS, you need to set <code>commonjs</code>.</p>
332
- <ul class="list-disc pl-5 my-4 leading-7">
333
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>&#x27;commonjs&#x27; | &#x27;module&#x27;</code></li>
334
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>&#x27;module&#x27;</code></li>
335
- </ul>
336
- <h2 id="splitting" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#splitting">#</a>splitting</h2>
337
- <p class="my-4 leading-7">Whether to enable code splitting</p>
338
- <ul class="list-disc pl-5 my-4 leading-7">
339
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>boolean</code></li>
340
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>false</code></li>
341
- </ul>
342
- <h2 id="style" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#style">#</a>style</h2>
343
- <p class="my-4 leading-7">Configure style-related configuration</p>
344
- <h2 id="styleless" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#styleless">#</a>style.less</h2>
345
- <p class="my-4 leading-7">less-related configuration</p>
346
- <h2 id="stylelesslessoptions" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#stylelesslessoptions">#</a>style.less.lessOptions</h2>
347
- <p class="my-4 leading-7">Refer to <a href="https://less.bootcss.com/usage/#less-options" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">less</a> for detailed configuration</p>
348
- <ul class="list-disc pl-5 my-4 leading-7">
349
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>object</code></li>
350
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>{ javascriptEnabled: true }</code></li>
351
- </ul>
352
- <h2 id="stylelessadditionaldata" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#stylelessadditionaldata">#</a>style.less.additionalData</h2>
353
- <p class="my-4 leading-7">Add <code>Less</code> code to the beginning of the entry file.</p>
354
- <ul class="list-disc pl-5 my-4 leading-7">
355
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>string</code></li>
356
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>undefined</code></li>
357
- </ul>
358
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> style: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> less: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> additionalData: `@base-color: #c6538c;`,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
359
- <h2 id="stylelessimplementation" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#stylelessimplementation">#</a>style.less.implementation</h2>
360
- <p class="my-4 leading-7">Configure the implementation library used by <code>Less</code>, if not specified, the built-in version used is <code>4.1.3</code>.</p>
361
- <ul class="list-disc pl-5 my-4 leading-7">
362
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>string | object</code></li>
363
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>undefined</code></li>
364
- </ul>
365
- <p class="my-4 leading-7">Specify the implementation library for <code>Less</code> when the <code>object</code> type is specified.</p>
366
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> style: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> less: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> implementation: require(&#x27;less&#x27;),</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
367
- <p class="my-4 leading-7">For the <code>string</code> type, specify the path to the implementation library for <code>Less</code></p>
368
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> style: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> less: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> implementation: require.resolve(&#x27;less&#x27;),</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
369
- <h2 id="stylesass" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#stylesass">#</a>style.sass</h2>
370
- <p class="my-4 leading-7">sass-related configuration.</p>
371
- <h2 id="stylesasssassoptions" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#stylesasssassoptions">#</a>style.sass.sassOptions</h2>
372
- <p class="my-4 leading-7">Refer to <a href="https://github.com/sass/node-sass#options" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">node-sass</a> for detailed configuration.</p>
373
- <ul class="list-disc pl-5 my-4 leading-7">
374
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>object</code></li>
375
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>{}</code></li>
376
- </ul>
377
- <h2 id="stylesassadditionaldata" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#stylesassadditionaldata">#</a>style.sass.additionalData</h2>
378
- <p class="my-4 leading-7">Add <code>Sass</code> code to the beginning of the entry file.</p>
379
- <ul class="list-disc pl-5 my-4 leading-7">
380
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>string | Function</code></li>
381
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>undefined</code></li>
382
- </ul>
383
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> style: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> sass: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> additionalData: `$base-color: #c6538c;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> $border-dark: rgba($base-color, 0.88);`,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
384
- <h2 id="stylesassimplementation" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#stylesassimplementation">#</a>style.sass.implementation</h2>
385
- <p class="my-4 leading-7">Configure the implementation library used by <code>Sass</code>, the built-in version used is <code>1.5.4</code> if not specified.</p>
386
- <ul class="list-disc pl-5 my-4 leading-7">
387
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>string | object</code></li>
388
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>undefined</code></li>
389
- </ul>
390
- <p class="my-4 leading-7">Specify the implementation library for <code>Sass</code> when the <code>object</code> type is specified.</p>
391
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> style: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> sass: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> implementation: require(&#x27;sass&#x27;),</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
392
- <p class="my-4 leading-7">For the <code>string</code> type, specify the path to the <code>Sass</code> implementation library</p>
393
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> style: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> sass: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> implementation: require.resolve(&#x27;sass&#x27;),</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div>
394
- <h2 id="stylepostcss" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#stylepostcss">#</a>style.postcss</h2>
395
- <ul class="list-disc pl-5 my-4 leading-7">
396
- <li class="[&amp;:not(:first-child)]:mt-2">plugins</li>
397
- <li class="[&amp;:not(:first-child)]:mt-2">processOptions</li>
398
- </ul>
399
- <p class="my-4 leading-7">See <a href="https://github.com/postcss/postcss#options" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">PostCSS</a> for detailed configuration</p>
400
- <p class="my-4 leading-7"><strong class="font-semibold">Basic usage:</strong></p>
401
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> style: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> postcss: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> plugins: [yourPostCSSPlugin],</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
402
- <h2 id="styleinject" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#styleinject">#</a>style.inject</h2>
403
- <p class="my-4 leading-7">Configure whether to insert CSS styles into JavaScript code in bundle mode.</p>
404
- <ul class="list-disc pl-5 my-4 leading-7">
405
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>boolean</code></li>
406
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>false</code></li>
407
- </ul>
408
- <p class="my-4 leading-7">Set <code>inject</code> to <code>true</code> to enable this feature:</p>
409
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> inject: true,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div>
410
- <p class="my-4 leading-7">Once enabled, you will see the CSS code referenced in the source code included in the bundled JavaScript output.</p>
411
- <p class="my-4 leading-7">For example, if you write <code>import &#x27;./index.scss&#x27;</code> in the source code, you will see the following code in the output:</p>
412
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="dist/index.js" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5">dist/</span>index.js</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>// node_modules/style-inject/dist/style-inject.es.js</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>function styleInject(css, ref) {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> // ...</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>}</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>var style_inject_es_default = styleInject;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span></span></div></div><div><div style="display:inline-block;margin-left:16px"><span>// src/index.scss</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>var css_248z = &#x27;.body {\n color: black;\n}&#x27;;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>style_inject_es_default(css_248z);</span></div></div><br/></code></div></div></div></div>
413
- <div class="modern-directive tip"><div class="modern-directive-title">TIP</div><div class="modern-directive-content"><p class="my-4 leading-7">After enabling <code>inject</code>, you need to pay attention to the following points:</p><ul class="list-disc pl-5 my-4 leading-7">
414
- <li class="[&amp;:not(:first-child)]:mt-2"><code>@import</code> in CSS files will not be processed. If your CSS file contains <code>@import</code>, you need to manually import the CSS file in the JS file (less and scss files are not required because they have preprocessing).</li>
415
- <li class="[&amp;:not(:first-child)]:mt-2">Consider the impact of <code>sideEffects</code>. By default, our builder assumes that CSS has side effects. If the <code>sideEffects</code> field is set in your project or third-party package&#x27;s package.json and does not include this CSS file, you will receive a warning:</li>
416
- </ul><div class="ch-codeblock not-prose "><div class="ch-code" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>[LIBUILD:ESBUILD_WARN] Ignoring this import because &quot;src/index.scss&quot; was marked as having no side effects by plugin &quot;libuild:adapter&quot;</span></div></div><br/></code></div></div><p class="my-4 leading-7">You can resolve this by configuring <a href="#sideeffects" class="link_2d294 undefined">sideEffects</a>.</p><h2 id="styleautomodules" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#styleautomodules">#</a>style.autoModules</h2><p class="my-4 leading-7">Enable CSS Modules automatically based on the filename.</p><ul class="list-disc pl-5 my-4 leading-7">
417
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>boolean | RegExp</code></li>
418
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>true</code></li>
419
- </ul><p class="my-4 leading-7"><code>true</code> : Enables CSS Modules for style files ending with <code>.module.css</code> <code>.module.less</code> <code>.module.scss</code> <code>.module.sass</code> filenames</p><p class="my-4 leading-7"><code>false</code> : Disable CSS Modules.</p><p class="my-4 leading-7"><code>RegExp</code> : Enables CSS Modules for all files that match the regular condition.</p><h2 id="stylemodules" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#stylemodules">#</a>style.modules</h2><p class="my-4 leading-7">CSS Modules configuration</p><ul class="list-disc pl-5 my-4 leading-7">
420
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>object</code></li>
421
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>{}</code></li>
422
- </ul><p class="my-4 leading-7">A common configuration is <code>localsConvention</code>, which changes the class name generation rules for css modules</p><div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> style: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> modules: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> localsConvention: &#x27;camelCaseOnly&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div><p class="my-4 leading-7">For the following styles</p><div class="ch-codeblock not-prose "><div class="ch-code" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>.box-title {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> color: red;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>}</span></div></div><br/></code></div></div><p class="my-4 leading-7">You can use <code>styles.boxTitle</code> to access</p><p class="my-4 leading-7">For detailed configuration see <a href="https://github.com/madyankin/postcss-modules#usage" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">postcss-modules</a></p><h2 id="styletailwindcss" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#styletailwindcss">#</a>style.tailwindcss</h2><p class="my-4 leading-7">tailwindcss related configuration</p><ul class="list-disc pl-5 my-4 leading-7">
423
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>object | Function</code></li>
424
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>see configuration details below</code></li>
425
- </ul><div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>const tailwind = {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> content: [</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> &#x27;./config/html/**/*.html&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> &#x27;./config/html/**/*.ejs&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> &#x27;./config/html/**/*.hbs&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> &#x27;./src/**/*.js&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> &#x27;./src/**/*.jsx&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> &#x27;./src/**/*.ts&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> &#x27;./src/**/*.tsx&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> &#x27;./storybook/**/*&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> ],</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div><p class="my-4 leading-7">When the value is of type <code>object</code>, it is merged with the default configuration via <code>Object.assign</code>.</p><p class="my-4 leading-7">When the value is of type <code>Function</code>, the object returned by the function is merged with the default configuration via <code>Object.assign</code>.</p><p class="my-4 leading-7">The <code>theme</code> property is not allowed, otherwise the build will fail, using <a href="/module-tools/en/api/config/design-system.html" class="link_2d294 undefined"><code>designSystem</code></a> as the <code>Tailwind CSS Theme</code> configuration.</p><p class="my-4 leading-7">The rest of the usage is the same as Tailwind CSS: <a href="https://tailwindcss.com/docs/configuration" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">Quick Portal</a>.</p><h2 id="target" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#target">#</a>target</h2><p class="my-4 leading-7"><code>target</code> is used to set the target environment for the generated JavaScript code. It enables Module Tools to transform JavaScript syntax that is not recognized by the target environment into older versions of JavaScript syntax that are compatible with these environments.</p><ul class="list-disc pl-5 my-4 leading-7">
426
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>:</li>
427
- </ul><div class="ch-codeblock not-prose "><div class="ch-code" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>type Target =</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> | &#x27;es5&#x27;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> | &#x27;es6&#x27;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> | &#x27;es2015&#x27;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> | &#x27;es2016&#x27;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> | &#x27;es2017&#x27;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> | &#x27;es2018&#x27;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> | &#x27;es2019&#x27;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> | &#x27;es2020&#x27;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> | &#x27;es2021&#x27;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> | &#x27;es2022&#x27;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> | &#x27;esnext&#x27;;</span></div></div><br/></code></div></div><ul class="list-disc pl-5 my-4 leading-7">
428
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>&#x27;es6&#x27;</code></li>
429
- </ul><p class="my-4 leading-7">For example, compile the code to <code>es5</code> syntax:</p><div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> target: &#x27;es5&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div><h2 id="transformimport" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#transformimport">#</a>transformImport</h2><p class="my-4 leading-7">Using <a href="https://swc.rs/" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">SWC</a> provides the same ability and configuration as <a href="https://github.com/umijs/babel-plugin-import" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined"><code>babel-plugin-import</code></a>.</p><ul class="list-disc pl-5 my-4 leading-7">
430
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>object[]</code></li>
431
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>[]</code></li>
432
- </ul><p class="my-4 leading-7">The elements of the array are configuration objects for <code>babel-plugin-import</code>, which can be referred to <a href="https://github.com/umijs/babel-plugin-import#options" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">options</a>。</p><p class="my-4 leading-7"><strong class="font-semibold">Example:</strong></p><div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default defineConfig({</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> transformImport: [</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> // babel-plugin-import`s options config</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> libraryName: &#x27;foo&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> style: true,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> ],</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>});</span></div></div><br/></code></div></div></div></div><h3 id="notes" class="mt-10 mb-2 leading-7 text-xl title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#notes">#</a>Notes</h3><p class="my-4 leading-7">Reference the <a href="/module-tools/en/plugins/official-list/plugin-import.html#Notes" class="link_2d294 undefined">Import Plugin - Notes</a></p><h2 id="umdglobals" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#umdglobals">#</a>umdGlobals</h2><p class="my-4 leading-7">Specify global variables for external import of umd products</p><ul class="list-disc pl-5 my-4 leading-7">
433
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>Record&lt;string, string&gt;</code></li>
434
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>{}</code></li>
435
- </ul><div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> umdGlobals: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> react: &#x27;React&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> &#x27;react-dom&#x27;: &#x27;ReactDOM&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div><p class="my-4 leading-7">At this point, <code>react</code> and <code>react-dom</code> will be seen as global variables imported externally and will not be packed into the umd product, but will be accessible by way of <code>global.React</code> and <code>global.ReactDOM</code></p><h2 id="umdmodulename" class="mt-14 mb-6 text-2xl tracking-tight title_2d294"><a class="link_2d294 header-anchor" aria-hidden="true" href="#umdmodulename">#</a>umdModuleName</h2><p class="my-4 leading-7">Specifies the module name of the umd product</p><ul class="list-disc pl-5 my-4 leading-7">
436
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Type</strong>: <code>string | Function</code></li>
437
- <li class="[&amp;:not(:first-child)]:mt-2"><strong class="font-semibold">Default</strong>: <code>name =&gt; name</code></li>
438
- </ul><div class="ch-codeblock not-prose "><div class="ch-code" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> format: &#x27;umd&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> umdModuleName: &#x27;myLib&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div><p class="my-4 leading-7">At this point the umd product will go to mount on <code>global.myLib</code></p><p class="my-4 leading-7">:::tip</p><ul class="list-disc pl-5 my-4 leading-7">
439
- <li class="[&amp;:not(:first-child)]:mt-2">The module name of the umd product must not conflict with the global variable name.</li>
440
- <li class="[&amp;:not(:first-child)]:mt-2">Module names will be converted to camelCase, e.g. <code>my-lib</code> will be converted to <code>myLib</code>, refer to <a href="https://github.com/babel/babel/blob/main/packages/babel-types/src/converters/toIdentifier.ts" target="_blank" rel="noopener noreferrer" class="link_2d294 undefined">toIdentifier</a>.</li>
441
- </ul></div></div>
442
- <p class="my-4 leading-7">Also the function form can take one parameter, which is the output path of the current package file</p>
443
- <div class="ch-codegroup not-prose "><div class="ch-editor-frame" style="background:#2e3440"><div class="ch-frame-title-bar" style="color:#C5C5C5;background:#2e3440"><div class="ch-frame-buttons"><div class="ch-frame-button ch-frame-button-left"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-middle"></div><div class="ch-frame-button-space"></div><div class="ch-frame-button ch-frame-button-right"></div></div><div title="modern.config.ts" data-ch-tab="north" class="ch-editor-tab ch-editor-tab-active" style="background:#3b4252;color:#d8dee9;border-right-color:#3b425200;border-bottom-color:#88c0d000"><div><span style="opacity:0.5"></span>modern.config.ts</div></div><div style="flex:1;min-width:0.8em"></div><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="ch-editor-button"><title>Copy</title><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.6px" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg></div><div data-ch-panel="north" style="flex-grow:1;overflow:hidden"><div class="ch-code-wrapper" style="margin:0;padding:0;position:relative;white-space:pre;box-sizing:content-box;opacity:0;overflow:auto;height:100%"><code class="ch-code-scroll-parent"><br/><div><div style="display:inline-block;margin-left:16px"><span>export default {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> buildConfig: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> format: &#x27;umd&#x27;,</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> umdModuleName: path =&gt; {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> if (path.includes(&#x27;index&#x27;)) {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> return &#x27;myLib&#x27;;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> } else {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> return &#x27;myLib2&#x27;;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> }</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span> },</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>};</span></div></div><br/></code></div></div></div></div><!--/$--><div><footer class="mt-8"><div class="xs:flex pb-5 px-2 justify-end items-center"></div><div class="flex flex-col"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/document/module-doc/docs/en/api/config/build-config.md" target="_blank" class="editLink_469b1"><svg width="18" height="18" viewBox="0 0 32 32" class="h-5.5 mr-2 inline-block" style="vertical-align:-5px"><path fill="currentColor" d="M2 26h28v2H2zM25.4 9c.8-.8.8-2 0-2.8l-3.6-3.6c-.8-.8-2-.8-2.8 0l-15 15V24h6.4l15-15zm-5-5L24 7.6l-3 3L17.4 7l3-3zM6 22v-3.6l10-10 3.6 3.6-10 10H6z"></path></svg>Edit this page on GitHub</a></div><div class="flex flex-col sm:flex-row sm:justify-around gap-4 pt-6"><div class="prev_021f9 flex flex-col"><a class="link_2a8f5 pager-link_021f9 cursor-pointer" target="" href="/module-tools/en/api/index.html"><span class="desc_021f9">Previous Page</span><span class="title_021f9">Overview</span></a></div><div class="next_021f9 flex flex-col"><a class="link_2a8f5 pager-link_021f9 next_021f9 cursor-pointer" target="" href="/module-tools/en/api/config/build-preset.html"><span class="desc_021f9">Next page</span><span class="title_021f9">buildPreset</span></a></div></div></footer></div></div></div><div class="aside-container_12c7d" style="max-height:calc(100vh - (var(--modern-nav-height) + 32px));overflow:scroll"><div><div class="flex flex-col"><div class="&lt;lg:hidden"><div id="aside-container" class="relative pl-4 text-sm font-medium"><div class="leading-7 block text-sm font-semibold">ON THIS PAGE</div><nav class="mt-1"><ul class="relative"><li><a href="#alias" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">alias</a></li><li><a href="#asset" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">asset</a></li><li><a href="#assetpath" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">asset.path</a></li><li><a href="#assetlimit" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">asset.limit</a></li><li><a href="#assetpublicpath" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">asset.publicPath</a></li><li><a href="#assetsvgr" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">asset.svgr</a></li><li><a href="#assetsvgrinclude" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">asset.svgr.include</a></li><li><a href="#assetsvgrexclude" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">asset.svgr.exclude</a></li><li><a href="#autoexternal" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">autoExternal</a></li><li><a href="#autoexternaldependencies" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">autoExternal.dependencies</a></li><li><a href="#autoexternalpeerdependencies" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">autoExternal.peerDependencies</a></li><li><a href="#buildtype" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">buildType</a></li><li><a href="#copy" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">copy</a></li><li><a href="#copypatterns" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">copy.patterns</a></li><li><a href="#copyoptions" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">copy.options</a></li><li><a href="#define" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">define</a></li><li><a href="#dts" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">dts</a></li><li><a href="#dtsabortonerror" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">dts.abortOnError</a></li><li><a href="#dtsdistpath" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">dts.distPath</a></li><li><a href="#dtsonly" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">dts.only</a></li><li><a href="#dtsrespectexternal" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">dts.respectExternal</a></li><li><a href="#dtstsconfigpath" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">dts.tsconfigPath</a></li><li><a href="#esbuildoptions" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">esbuildOptions</a></li><li><a href="#externalhelpers" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">externalHelpers</a></li><li><a href="#externals" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">externals</a></li><li><a href="#format" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">format</a></li><li><a href="#format:-\&#x27;esm\&#x27;" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:normal">format: \&#x27;esm\&#x27;</a></li><li><a href="#format:-\&#x27;cjs\&#x27;" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:normal">format: \&#x27;cjs\&#x27;</a></li><li><a href="#format:-\&#x27;iife\&#x27;" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:normal">format: \&#x27;iife\&#x27;</a></li><li><a href="#format:-\&#x27;umd\&#x27;" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:normal">format: \&#x27;umd\&#x27;</a></li><li><a href="#input" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">input</a></li><li><a href="#jsx" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">jsx</a></li><li><a href="#metafile" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">metafile</a></li><li><a href="#minify" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">minify</a></li><li><a href="#outdir" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">outDir</a></li><li><a href="#platform" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">platform</a></li><li><a href="#redirect" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">redirect</a></li><li><a href="#sideeffects" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">sideEffects</a></li><li><a href="#sourcedir" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">sourceDir</a></li><li><a href="#sourcemap" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">sourceMap</a></li><li><a href="#sourcetype" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">sourceType</a></li><li><a href="#splitting" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">splitting</a></li><li><a href="#style" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style</a></li><li><a href="#styleless" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style.less</a></li><li><a href="#stylelesslessoptions" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style.less.lessOptions</a></li><li><a href="#stylelessadditionaldata" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style.less.additionalData</a></li><li><a href="#stylelessimplementation" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style.less.implementation</a></li><li><a href="#stylesass" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style.sass</a></li><li><a href="#stylesasssassoptions" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style.sass.sassOptions</a></li><li><a href="#stylesassadditionaldata" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style.sass.additionalData</a></li><li><a href="#stylesassimplementation" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style.sass.implementation</a></li><li><a href="#stylepostcss" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style.postcss</a></li><li><a href="#styleinject" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style.inject</a></li><li><a href="#styleautomodules" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style.autoModules</a></li><li><a href="#stylemodules" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style.modules</a></li><li><a href="#styletailwindcss" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">style.tailwindcss</a></li><li><a href="#target" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">target</a></li><li><a href="#transformimport" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">transformImport</a></li><li><a href="#notes" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:normal">Notes</a></li><li><a href="#umdglobals" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">umdGlobals</a></li><li><a href="#umdmodulename" class="leading-7 transition-all duration-300 hover:text-text-1 text-text-2 block" style="font-size:13px;padding-left:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:semibold">umdModuleName</a></li></ul></nav></div></div></div></div></div></div></div></section></div></div><div id="search-container"></div></body></html>