npm - @modern-js/module-tools-docs - Versions diffs - 2.0.2 → 2.2.0-beta.0 - Mend

@modern-js/module-tools-docs 2.0.2 → 2.2.0-beta.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 (308) hide show

package/docs/.island/dist/zh/guide/advance/asset.html ADDED Viewed

@@ -0,0 +1,68 @@
+<!DOCTYPE html>
+  <html>
+    <head>
+      <meta charset="utf-8">
+      <meta name="viewport" content="width=device-width,initial-scale=1">
+      <link rel="icon" href="" type="image/svg+xml"></link>
+      <script  id="check-dark-light">
+        ;(() => {
+          const saved = localStorage.getItem('island-theme-appearance')
+          const prefereDark = window.matchMedia('(prefers-color-scheme: dark)').matches
+          if (!saved || saved === 'auto' ? prefereDark : saved === 'dark') {
+            document.documentElement.classList.add('dark')
+          }
+        })()
+      </script>
+      <title data-rh="true">处理静态资源文件</title>
+      <meta data-rh="true" name="description" content="Island"/>
+      <script defer src='https://ga.jspm.io/npm:es-module-shims@1.6.0/dist/es-module-shims.js'></script>
+      <script type="importmap">
+        {
+          "imports": {
+            "react": "/react.js","react-dom": "/react-dom.js","react-dom/client": "/react-dom_client.js","react/jsx-runtime": "/react_jsx-runtime.js"
+          }
+        }
+      </script>
+      <link rel="stylesheet" href="/assets/style.2e5f7bc2.css">
+    </head>
+    <body>
+      <div id="root"><div style="height:100%"><header relative="" z="4" fixed="md:~" class="top-0 left-0" w="100%"><div relative="" p="l-8 sm:x-8" transition="background-color duration-500" class="divider-bottom md:border-b-transparent lg:border-b-transparent" nav-h="mobile lg:desktop"><div flex="" justify="between" m="0 auto" nav-h="mobile lg:desktop" class="_container_1ic07_52  _has-sidebar_1ic07_16"><div shrink="0" border="border t-0 b-1 border-solid transparent" class="_nav-bar-title_1ic07_16"><a href="/zh/" w="100%" h="100%" text="1rem" font="semibold" transition="opacity duration-300" hover="opacity-60" class="flex items-center"><span>Module tools</span></a></div><div class="_content_1ic07_24" flex="~ 1" justify="end" items-center=""><div class="search" flex="sm:1" pl="sm:8"><div __island="Search:1"><div flex="" items-center="~" relative="" mr="2" font="semibold"><svg width="32" height="32" viewBox="0 0 32 32" w="5" h="5" fill="currentColor"><path fill="#888888" d="m29 27.586l-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9a9.01 9.01 0 0 1-9-9Z"></path></svg><input disabled="" cursor="text focus:auto" placeholder="Search" height="8" border="none" type="text" text="sm" p="t-0 r-2 b-0 l-2" transition="all duration-200 ease" class="rounded-sm _searchInput_y03a3_1 " aria-label="Search" autoComplete="off"/><div m="r-3" w="10" h="6" p="x-1.5" rounded="md" border="1px solid gray-light-3" text="xs gray-light-3" flex="~" items-center="~" justify="around" class="_searchCommand_y03a3_7"><span>⌘</span><span>K</span></div></div></div></div><div class="_rightNav_1ic07_42"><div class="menu"><div text="sm" font="medium" m="x-3" class="text-brand"><a href="/zh/guide/intro/welcome.html" target="" class="_link_r3fql_1 ">指南</a></div><div text="sm" font="medium" m="x-3" class=""><a href="/zh/api/index.html" target="" class="_link_r3fql_1 ">API</a></div><div m="x-3" last="mr-0"><div __island="NavMenuGroup:4"><div relative=""><button flex="center" nav-h="mobile sm:desktop" font="medium" text="sm text-1 hover:text-2" transition="color duration-200" class="nav-menu-group-button"><span mr="1" text="sm" font="medium">v2.0.0-beta.4</span><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M16 22L6 12l1.4-1.4l8.6 8.6l8.6-8.6L26 12z"></path></svg></button><div absolute="" pos="top-13 right-0" m="x-0.8" transition="opacity duration-300" class="nav-menu-group-content" style="opacity:0;visibility:hidden"><div p="3" w="100%" h="100%" class="min-w-128px max-h-100vh" border-1="" rounded="xl" bg="bg-default" style="box-shadow:var(--island-shadow-3);margin-right:-1.5rem;z-index:100"><div font="medium"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer" class="_link_r3fql_1 "><div rounded="md" hover="bg-bg-mute" p="y-1.6 l-3"><div flex=""><span mr="1">更新日志</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div><div font="medium"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer" class="_link_r3fql_1 "><div rounded="md" hover="bg-bg-mute" p="y-1.6 l-3"><div flex=""><span mr="1">贡献指南</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div></div></div></div></div></div></div><div class="translation" flex="~" text="sm" font="bold" items-center="~" before="menu-item-before"><div m="x-1.5"><div __island="NavMenuGroup:5"><div relative=""><button flex="center" nav-h="mobile sm:desktop" font="medium" text="sm text-1 hover:text-2" transition="color duration-200" class="nav-menu-group-button"><span mr="1" text="sm" font="medium"><svg width="32" height="32" viewBox="0 0 32 32" w="18px" h="18px"><path fill="currentColor" d="M27.85 29H30l-6-15h-2.35l-6 15h2.15l1.6-4h6.85zm-7.65-6l2.62-6.56L25.45 23zM18 7V5h-7V2H9v3H2v2h10.74a14.71 14.71 0 0 1-3.19 6.18A13.5 13.5 0 0 1 7.26 9h-2.1a16.47 16.47 0 0 0 3 5.58A16.84 16.84 0 0 1 3 18l.75 1.86A18.47 18.47 0 0 0 9.53 16a16.92 16.92 0 0 0 5.76 3.84L16 18a14.48 14.48 0 0 1-5.12-3.37A17.64 17.64 0 0 0 14.8 7z"></path></svg></span><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M16 22L6 12l1.4-1.4l8.6 8.6l8.6-8.6L26 12z"></path></svg></button><div absolute="" pos="top-13 right-0" m="x-0.8" transition="opacity duration-300" class="nav-menu-group-content" style="opacity:0;visibility:hidden"><div p="3" w="100%" h="100%" class="min-w-128px max-h-100vh" border-1="" rounded="xl" bg="bg-default" style="box-shadow:var(--island-shadow-3);margin-right:-1.5rem;z-index:100"><div rounded="md" p="y-1.6 l-3"><span mr="1" text="brand">简体中文</span></div><div font="medium"><a href="/en" target="" class="_link_r3fql_1 "><div rounded="md" hover="bg-bg-mute" p="y-1.6 l-3"><div flex=""><span mr="1">English</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div></div></div></div></div></div></div><div class="appearance" before="menu-item-before" display="none sm:flex" items-center="center"><div __island="SwitchAppearance:6"><button class="_switch_1tqe3_1 undefined" id="" type="button" role="switch"><span class="_check_1tqe3_17"><span class="_icon_1tqe3_34"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewBox="0 0 24 24" class="_sun_8e60k_1"><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewBox="0 0 24 24" class="_moon_8e60k_5"><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg></span></span></button></div></div><div __island="SocialLinks:2"><div class="social-links" nav-h="mobile sm:desktop" flex="" items-center="" before="menu-item-before" relative=""><div h="100%" flex="" gap="x-4" items-center="" transition="color duration-300"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer"><div class="_social-links-icon_wx6p9_1"><svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></div></a></div></div></div></div><div __island="NavHamburger:3"><button class=" _navHamburger_14nz8_1"><span class="_container_14nz8_14"><span class="_top_14nz8_21"></span><span class="_middle_14nz8_27"></span><span class="_bottom_14nz8_33"></span></span></button><div class="_navScreen_1mkpq_1 " id="navScreen"><div class="_container_1mkpq_21"><div class="_navMenu_1mkpq_27"><div w="100%" class="_navMenuItem_1mkpq_34"><div text="sm" font="medium" m="x-3" class="text-brand"><a href="/zh/guide/intro/welcome.html" target="" class="_link_r3fql_1 ">指南</a></div></div><div w="100%" class="_navMenuItem_1mkpq_34"><div text="sm" font="medium" m="x-3" class=""><a href="/zh/api/index.html" target="" class="_link_r3fql_1 ">API</a></div></div><div w="100%" class="_navMenuItem_1mkpq_34"><div m="x-3" last="mr-0"><div relative="" class=" _navScreenMenuGroup_1xte3_1"><button class="_button_1xte3_12"><span class="_buttonSpan_1xte3_25">v2.0.0-beta.4</span><svg width="1em" height="1em" viewBox="0 0 32 32" class=" _down_1xte3_40 "><path fill="currentColor" d="M16 22L6 12l1.4-1.4l8.6 8.6l8.6-8.6L26 12z"></path></svg></button><div><div class="_items_1xte3_32"><div class="pa-1" font="medium"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer" class="_link_r3fql_1 "><div><div flex=""><span mr="1">更新日志</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div><div class="pa-1" font="medium"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer" class="_link_r3fql_1 "><div><div flex=""><span mr="1">贡献指南</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div></div></div></div></div></div></div><div class="_socialAndAppearance_1mkpq_50" flex="~" justify="center" items-center="center"><div class="items-center appearance pa-2 _navAppearance_1mkpq_46" flex="~" justify="center"><button class="_switch_1tqe3_1 undefined" id="" type="button" role="switch"><span class="_check_1tqe3_17"><span class="_icon_1tqe3_34"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewBox="0 0 24 24" class="_sun_8e60k_1"><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewBox="0 0 24 24" class="_moon_8e60k_5"><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg></span></span></button></div><div __island="SocialLinks:7"><div class="social-links" nav-h="mobile sm:desktop" flex="" items-center="" before="menu-item-before" relative=""><div h="100%" flex="" gap="x-4" items-center="" transition="color duration-300"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer"><div class="_social-links-icon_wx6p9_1"><svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></div></a></div></div></div></div><div flex="~" text="sm" font="bold" justify="center"><div m="x-1.5"><div relative="" class=" _navScreenMenuGroup_1xte3_1"><button class="_button_1xte3_12"><span class="_buttonSpan_1xte3_25"><svg width="32" height="32" viewBox="0 0 32 32" w="18px" h="18px"><path fill="currentColor" d="M27.85 29H30l-6-15h-2.35l-6 15h2.15l1.6-4h6.85zm-7.65-6l2.62-6.56L25.45 23zM18 7V5h-7V2H9v3H2v2h10.74a14.71 14.71 0 0 1-3.19 6.18A13.5 13.5 0 0 1 7.26 9h-2.1a16.47 16.47 0 0 0 3 5.58A16.84 16.84 0 0 1 3 18l.75 1.86A18.47 18.47 0 0 0 9.53 16a16.92 16.92 0 0 0 5.76 3.84L16 18a14.48 14.48 0 0 1-5.12-3.37A17.64 17.64 0 0 0 14.8 7z"></path></svg></span><svg width="1em" height="1em" viewBox="0 0 32 32" class=" _down_1xte3_40 "><path fill="currentColor" d="M16 22L6 12l1.4-1.4l8.6 8.6l8.6-8.6L26 12z"></path></svg></button><div><div class="_items_1xte3_32"><div class="pa-1"><span mr="1" text="brand">简体中文</span></div><div class="pa-1" font="medium"><a href="/en" target="" class="_link_r3fql_1 "><div><div flex=""><span mr="1">English</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div></div></div></div></div></div></div></div></div></div></div></div></header><section style="padding-top:var(--island-nav-height)"><div p="t-0 x-6 b-24 sm:6" class="_docLayout_5cssi_8"><div __island="SideMenu:8"><div class="_localNav_ncerp_1"><button flex="center" class="_menu_ncerp_16"><div text="md" mr="2" class="i-carbon:menu"></div><span text="md ">Menu</span></button></div><aside class="_sidebar_iav29_1 "><nav><section block="~" not-first="divider-top mt-4"><div flex="~" justify="between" items-start="~" class="items-center"><h2 m="t-3 b-2" text="1rem text-1" font="bold">介绍</h2></div><div mb="1.4 sm:1" style="height:auto;display:block"><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/intro/welcome.html" target="" class="_link_r3fql_1 ">欢迎使用</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/intro/why-module-engineering-solution.html" target="" class="_link_r3fql_1 ">为什么需要模块工程解决方案</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/intro/getting-started.html" target="" class="_link_r3fql_1 ">快速开始</a></div></div></div></div></section><section block="~" not-first="divider-top mt-4"><div flex="~" justify="between" items-start="~" class="items-center"><h2 m="t-3 b-2" text="1rem text-1" font="bold">基础使用</h2></div><div mb="1.4 sm:1" style="height:auto;display:block"><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/before-getting-started.html" target="" class="_link_r3fql_1 ">开始之前</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/command-preview.html" target="" class="_link_r3fql_1 ">命令预览</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/modify-output-product.html" target="" class="_link_r3fql_1 ">修改输出产物</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/use-micro-generator.html" target="" class="_link_r3fql_1 ">使用微生成器</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/using-storybook.html" target="" class="_link_r3fql_1 ">使用 Storybook</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/test-your-project.html" target="" class="_link_r3fql_1 ">测试项目</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/publish-your-project.html" target="" class="_link_r3fql_1 ">发布项目</a></div></div></div></div></section><section block="~" not-first="divider-top mt-4"><div flex="~" justify="between" items-start="~" class="items-center"><h2 m="t-3 b-2" text="1rem text-1" font="bold">进阶指南</h2></div><div mb="1.4 sm:1" style="height:auto;display:block"><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/advance/in-depth-about-build.html" target="" class="_link_r3fql_1 ">深入理解构建</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/advance/in-depth-about-dev-command.html" target="" class="_link_r3fql_1 ">深入理解 dev 命令</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/advance/copy.html" target="" class="_link_r3fql_1 ">使用 Copy 工具</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/advance/external-dependency.html" target="" class="_link_r3fql_1 ">如何处理第三方依赖</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/advance/build-umd.html" target="" class="_link_r3fql_1 ">构建 umd 产物</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-brand"><a href="/zh/guide/advance/asset.html" target="" class="_link_r3fql_1 ">处理静态文件</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/advance/extension.html" target="" class="_link_r3fql_1 ">插件扩展</a></div></div></div></div></section></nav></aside></div><div flex="~ 1 shrink-0" m="x-auto" class="_content_5cssi_2"><div m="x-auto" flex="~ col" class="max-w-100%"><div relative="~" m="x-auto" p="l-2" class="w-100% md:max-w-712px lg:min-w-640px "><div class="island-doc "><!--$--><h1 id="处理静态资源文件"><a class="header-anchor" aria-hidden="true" href="#处理静态资源文件">#</a>处理静态资源文件</h1>
+<p>模块工程会对代码中使用的静态资源进行处理。如果需要配置，则可以使用 <a href="/zh/api/build-config.html#asset"><code>buildConfig.asset</code></a> API。</p>
+<h2 id="默认行为"><a class="header-anchor" aria-hidden="true" href="#默认行为">#</a>默认行为</h2>
+<p>默认情况下，模块工程对于以下静态资源会进行处理：</p>
+<ul>
+<li><code>&#x27;.svg&#x27;</code>、<code>&#x27;.png&#x27;</code>、<code>&#x27;.jpg&#x27;</code>、<code>&#x27;.jpeg&#x27;</code>、<code>&#x27;.gif&#x27;</code>、<code>&#x27;.webp&#x27;</code></li>
+<li><code>&#x27;.ttf&#x27;</code>、<code>&#x27;.otf&#x27;</code>、<code>&#x27;.woff&#x27;</code>、<code>&#x27;.woff2&#x27;</code>、<code>&#x27;.eot&#x27;</code></li>
+<li><code>&#x27;.mp3&#x27;</code>、<code>&#x27;.mp4&#x27;</code>、<code>&#x27;.webm&#x27;</code>、<code>&#x27;.ogg&#x27;</code>、<code>&#x27;.wav&#x27;</code>、<code>&#x27;.flac&#x27;</code>、<code>&#x27;.aac&#x27;</code>、<code>&#x27;.mov&#x27;</code></li>
+</ul>
+<p>对于静态文件的处理，模块工程目前支持的功能有：</p>
+<ul>
+<li>设置静态资源路径为 <code>./assets</code>。</li>
+<li>对于超过 <strong>10kb</strong> 的文件会内联到代码中。</li>
+<li>对于 <code>.svg</code> 后缀的文件使用 <a href="https://react-svgr.com/" target="_blank" rel="nofollow">SVGR</a>。</li>
+</ul>
+<p>让我们看下面的例子：</p>
+<section class="ch-spotlight  "><div class="ch-spotlight-tabs"><div></div><div class="ch-spotlight-tab"><p>项目源代码。</p></div><div class="ch-spotlight-tab"><p>如果 <code>bg.png</code> 的大小小于 10 kb，则此时产物目录结构和产物内容为。</p></div><div class="ch-spotlight-tab"><p>如果 <code>bg.png</code> 的大小大于 10 kb，则此时产物目录结构和产物内容为。</p></div></div><div class="ch-spotlight-sticker"><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="./src/asset.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">./src/</span>asset.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 img from &#x27;./bg.png&#x27;;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>//...</span></div></div><br/></code></div></div></div></div></div></section>
+<p>当想要修改默认行为的时候，可以使用以下 API：</p>
+<ul>
+<li><code>asset.path</code>：修改静态资源文件输出路径。</li>
+<li><code>asset.limit</code>：修改内联静态资源文件的阈值。</li>
+</ul>
+<h2 id="设置-cdn-前缀"><a class="header-anchor" aria-hidden="true" href="#设置-cdn-前缀">#</a>设置 CDN 前缀</h2>
+<p>如果项目运行的环境是在浏览器下，我们有可能需要静态资源托管至 CDN，然后在生产环境使用。</p>
+<p>那么此时默认生成的构建产物中，我们需要在静态资源文件的路径前面增加 CDN 的基础路径。还是看一个例子：</p>
+<section class="ch-spotlight  "><div class="ch-spotlight-tabs"><div></div><div class="ch-spotlight-tab"><p>项目源代码。</p></div><div class="ch-spotlight-tab"><p><code>modern.config</code> 配置为。</p></div><div class="ch-spotlight-tab"><p>如果 <code>bg.png</code> 的大小大于 10 kb，则此时产物内容为。</p></div></div><div class="ch-spotlight-sticker"><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="./src/asset.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">./src/</span>asset.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 img from &#x27;./bg.png&#x27;;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>//...</span></div></div><br/></code></div></div></div></div></div></section>
+<h2 id="svgr"><a class="header-anchor" aria-hidden="true" href="#svgr">#</a>SVGR</h2>
+<p>WIP</p><!--/$--></div><footer mt="8"><div class="xs:flex" p="b-5" justify="between" items-center="~"><a flex="~" items-center="" leading-8="" font-medium="~" text="sm brand" hover="text-brand-dark" href="https://github.com/modern-js-dev/modern.js/tree/next/website/module-tools/docs/zh/guide/advance/asset.mdx" transition="color duration-300">📝 在 GitHub 上编辑此页</a><div flex="" text="sm text-2" leading-6="~" leading-8="sm:~" font-medium=""><p>上次更新: </p><span>2022/12/16 16:18:07</span></div></div><div flex="~ col sm:row" justify="sm:around" gap="2" divider-top="" pt="6"><div flex="~ col" class="_prev_1f77m_13"><a href="/zh/guide/advance/build-umd.html" class="_pager-link_1f77m_20"><span class="_desc_1f77m_43">上一页</span><span class="_title_1f77m_34">构建 umd 产物</span></a></div><div flex="~ col" class="_next_1f77m_16"><a href="/zh/guide/advance/extension.html" class="_pager-link_1f77m_20 _next_1f77m_16"><span class="_desc_1f77m_43">下一页</span><span class="_title_1f77m_34">插件扩展</span></a></div></div></footer></div></div><div relative="~" display="none lg:block" order="2" flex="1" p="l-8" class="max-w-256px"><div class="_aside-container_5cssi_32"><div flex="~ col" p="b-8" style="min-height:calc(100vh - (var(--island-nav-height-desktop) + 32px))"><div><div flex="~ col 1"><div display="lg:block"><div relative="" divider-left="" p="l-4" text="13px" font-medium="" id="aside-container"><div absolute="" pos="top-33px" opacity="0" w="1px" h="18px" bg="brand" style="left:-1px;transition:top 0.25s cubic-bezier(0, 1, 0.5, 1), background-color 0.5s, opacity 0.25s" id="aside-marker"></div><div block="~" leading-7="" text="13px" font="semibold">目录</div><nav><ul relative=""><li><a href="#默认行为" block="" leading-7="" text="text-2" avoid-text-overflow="" hover="text-text-1" transition="color duration-300" style="padding-left:0">默认行为</a></li><li><a href="#设置-cdn-前缀" block="" leading-7="" text="text-2" avoid-text-overflow="" hover="text-text-1" transition="color duration-300" style="padding-left:0">设置 CDN 前缀</a></li><li><a href="#svgr" block="" leading-7="" text="text-2" avoid-text-overflow="" hover="text-text-1" transition="color duration-300" style="padding-left:0">SVGR</a></li></ul></nav></div></div></div></div></div></div></div></div></div></section><div __island="BackTop:0"></div></div></div>
+      <script id="island-props">[{},{"langRoutePrefix":"/zh/"},{"socialLinks":[{"icon":"github","mode":"link","content":"https://github.com/modern-js-dev/modern.js"}]},{"localeData":{"lang":"zh","label":"简体中文","lastUpdatedText":"上次更新","nav":[{"text":"指南","link":"/zh/guide/intro/welcome","activeMatch":"/guide/"},{"text":"API","link":"/zh/api/","activeMatch":"/api/"},{"text":"v2.0.0-beta.4","items":[{"text":"更新日志","link":"https://github.com/modern-js-dev/modern.js"},{"text":"贡献指南","link":"https://github.com/modern-js-dev/modern.js"}]}],"sidebar":{"/zh/guide/":[{"text":"介绍","items":[{"text":"欢迎使用","link":"/zh/guide/intro/welcome"},{"text":"为什么需要模块工程解决方案","link":"/zh/guide/intro/why-module-engineering-solution"},{"text":"快速开始","link":"/zh/guide/intro/getting-started"}]},{"text":"基础使用","items":[{"text":"开始之前","link":"/zh/guide/basic/before-getting-started"},{"text":"命令预览","link":"/zh/guide/basic/command-preview"},{"text":"修改输出产物","link":"/zh/guide/basic/modify-output-product"},{"text":"使用微生成器","link":"/zh/guide/basic/use-micro-generator"},{"text":"使用 Storybook","link":"/zh/guide/basic/using-storybook"},{"text":"测试项目","link":"/zh/guide/basic/test-your-project"},{"text":"发布项目","link":"/zh/guide/basic/publish-your-project"}]},{"text":"进阶指南","items":[{"text":"深入理解构建","link":"/zh/guide/advance/in-depth-about-build"},{"text":"深入理解 dev 命令","link":"/zh/guide/advance/in-depth-about-dev-command"},{"text":"使用 Copy 工具","link":"/zh/guide/advance/copy"},{"text":"如何处理第三方依赖","link":"/zh/guide/advance/external-dependency"},{"text":"构建 umd 产物","link":"/zh/guide/advance/build-umd"},{"text":"处理静态文件","link":"/zh/guide/advance/asset"},{"text":"插件扩展","link":"/zh/guide/advance/extension"}]}],"/zh/api/":[{"text":"配置项","items":[{"text":"BuildConfig","link":"/zh/api/build-config"},{"text":"BuildPreset","link":"/zh/api/build-preset"},{"text":"Dev","link":"/zh/api/dev"},{"text":"Test","link":"/zh/api/test"},{"text":"Plugin","link":"/zh/api/plugin"},{"text":"DesignSystem","link":"/zh/api/design-system"}]}]},"title":"Module tools","outlineTitle":"目录","prevPageText":"上一页","nextPageText":"下一页","description":"模块工程解决方案","editLink":{"pattern":"https://github.com/modern-js-dev/modern.js/tree/next/website/module-tools/docs/:path","text":"📝 在 GitHub 上编辑此页"},"langRoutePrefix":"/zh/"},"siteData":{"lang":"en-US","title":"Module tools","description":"Island","themeConfig":{"locales":{"/zh/":{"lang":"zh","label":"简体中文","lastUpdatedText":"上次更新","nav":[{"text":"指南","link":"/zh/guide/intro/welcome","activeMatch":"/guide/"},{"text":"API","link":"/zh/api/","activeMatch":"/api/"},{"text":"v2.0.0-beta.4","items":[{"text":"更新日志","link":"https://github.com/modern-js-dev/modern.js"},{"text":"贡献指南","link":"https://github.com/modern-js-dev/modern.js"}]}],"sidebar":{"/zh/guide/":[{"text":"介绍","items":[{"text":"欢迎使用","link":"/zh/guide/intro/welcome"},{"text":"为什么需要模块工程解决方案","link":"/zh/guide/intro/why-module-engineering-solution"},{"text":"快速开始","link":"/zh/guide/intro/getting-started"}]},{"text":"基础使用","items":[{"text":"开始之前","link":"/zh/guide/basic/before-getting-started"},{"text":"命令预览","link":"/zh/guide/basic/command-preview"},{"text":"修改输出产物","link":"/zh/guide/basic/modify-output-product"},{"text":"使用微生成器","link":"/zh/guide/basic/use-micro-generator"},{"text":"使用 Storybook","link":"/zh/guide/basic/using-storybook"},{"text":"测试项目","link":"/zh/guide/basic/test-your-project"},{"text":"发布项目","link":"/zh/guide/basic/publish-your-project"}]},{"text":"进阶指南","items":[{"text":"深入理解构建","link":"/zh/guide/advance/in-depth-about-build"},{"text":"深入理解 dev 命令","link":"/zh/guide/advance/in-depth-about-dev-command"},{"text":"使用 Copy 工具","link":"/zh/guide/advance/copy"},{"text":"如何处理第三方依赖","link":"/zh/guide/advance/external-dependency"},{"text":"构建 umd 产物","link":"/zh/guide/advance/build-umd"},{"text":"处理静态文件","link":"/zh/guide/advance/asset"},{"text":"插件扩展","link":"/zh/guide/advance/extension"}]}],"/zh/api/":[{"text":"配置项","items":[{"text":"BuildConfig","link":"/zh/api/build-config"},{"text":"BuildPreset","link":"/zh/api/build-preset"},{"text":"Dev","link":"/zh/api/dev"},{"text":"Test","link":"/zh/api/test"},{"text":"Plugin","link":"/zh/api/plugin"},{"text":"DesignSystem","link":"/zh/api/design-system"}]}]},"title":"Module tools","outlineTitle":"目录","prevPageText":"上一页","nextPageText":"下一页","description":"模块工程解决方案","editLink":{"pattern":"https://github.com/modern-js-dev/modern.js/tree/next/website/module-tools/docs/:path","text":"📝 在 GitHub 上编辑此页"}},"/en/":{"lang":"en","label":"English","lastUpdated":"Last Updated","nav":[{"text":"Guide","link":"/en/guide/intro/welcome","activeMatch":"/guide/"},{"text":"API","link":"/en/api/","activeMatch":"/api/"},{"text":"v2.0.0-beta.4","items":[{"text":"Changelog","link":"https://github.com/modern-js-dev/modern.js"},{"text":"Contributing","link":"https://github.com/modern-js-dev/modern.js"}]}],"sidebar":{"/en/guide/":[{"text":"Introduction","items":[{"text":"WelCome","link":"/en/guide/intro/welcome"},{"text":"Why module project solution","link":"/en/guide/intro/why-module-engineering-solution"},{"text":"Getting Started","link":"/en/guide/intro/getting-started"}]},{"text":"Basic Guide","items":[{"text":"Before getting started","link":"/en/guide/basic/before-getting-started"},{"text":"Command preview","link":"/en/guide/basic/command-preview"},{"text":"Modify output product","link":"/en/guide/basic/modify-output-product"},{"text":"Use Micro generator","link":"/en/guide/basic/use-micro-generator"},{"text":"Using Storybook","link":"/en/guide/basic/using-storybook"},{"text":"Test project","link":"/en/guide/basic/test-your-project"},{"text":"Publish project","link":"/en/guide/basic/publish-your-project"}]},{"text":"Advanced Guide","items":[{"text":"In depth about build","link":"/en/guide/advance/in-depth-about-build"},{"text":"In depth about dev command","link":"/en/guide/advance/in-depth-about-dev-command"},{"text":"Use Copy Tools","link":"/en/guide/advance/copy"},{"text":"How to handle third-party dependencies","link":"/en/guide/advance/external-dependency"},{"text":"Build umd","link":"/en/guide/advance/build-umd"},{"text":"Handling static files","link":"/en/guide/advance/asset"},{"text":"Plugins extension","link":"/en/guide/advance/extension"}]}],"/en/api/":[{"text":"Config","items":[{"text":"BuildConfig","link":"/en/api/build-config"},{"text":"BuildPreset","link":"/en/api/build-preset"},{"text":"Dev","link":"/en/api/dev"},{"text":"Test","link":"/en/api/test"},{"text":"Plugin","link":"/en/api/plugin"},{"text":"DesignSystem","link":"/en/api/design-system"}]}]},"title":"Module tools","description":"Module Engineering Solutions","lastUpdatedText":"Last Updated","editLink":{"pattern":"https://github.com/modern-js-dev/modern.js/tree/next/website/module-tools/docs/:path","text":"📝 Edit this page on GitHub"}}},"outlineTitle":"ON THIS PAGE","socialLinks":[{"icon":"github","mode":"link","content":"https://github.com/modern-js-dev/modern.js"}],"footer":{"message":"The Module Engineering Solutions","copyright":"\nCopyright © 2022 ByteDance."}},"head":[["script",{"id":"check-dark-light"},"\n        ;(() => {\n          const saved = localStorage.getItem('island-theme-appearance')\n          const prefereDark = window.matchMedia('(prefers-color-scheme: dark)').matches\n          if (!saved || saved === 'auto' ? prefereDark : saved === 'dark') {\n            document.documentElement.classList.add('dark')\n          }\n        })()\n      "]],"base":"","icon":"","root":"/Users/targeral/github/targeral-modern-js/website/module-tools/docs","appearance":true},"pathname":"/zh/guide/advance/asset"},{"text":"v2.0.0-beta.4","items":[{"text":"更新日志","link":"https://github.com/modern-js-dev/modern.js"},{"text":"贡献指南","link":"https://github.com/modern-js-dev/modern.js"}]},{"items":[{"text":"简体中文","link":"/zh"},{"text":"English","link":"/en"}],"activeIndex":0,"isTranslation":true},{},{"socialLinks":[{"icon":"github","mode":"link","content":"https://github.com/modern-js-dev/modern.js"}]},{"pathname":"/zh/guide/advance/asset","langRoutePrefix":"","sidebarData":[{"text":"介绍","items":[{"text":"欢迎使用","link":"/zh/guide/intro/welcome"},{"text":"为什么需要模块工程解决方案","link":"/zh/guide/intro/why-module-engineering-solution"},{"text":"快速开始","link":"/zh/guide/intro/getting-started"}]},{"text":"基础使用","items":[{"text":"开始之前","link":"/zh/guide/basic/before-getting-started"},{"text":"命令预览","link":"/zh/guide/basic/command-preview"},{"text":"修改输出产物","link":"/zh/guide/basic/modify-output-product"},{"text":"使用微生成器","link":"/zh/guide/basic/use-micro-generator"},{"text":"使用 Storybook","link":"/zh/guide/basic/using-storybook"},{"text":"测试项目","link":"/zh/guide/basic/test-your-project"},{"text":"发布项目","link":"/zh/guide/basic/publish-your-project"}]},{"text":"进阶指南","items":[{"text":"深入理解构建","link":"/zh/guide/advance/in-depth-about-build"},{"text":"深入理解 dev 命令","link":"/zh/guide/advance/in-depth-about-dev-command"},{"text":"使用 Copy 工具","link":"/zh/guide/advance/copy"},{"text":"如何处理第三方依赖","link":"/zh/guide/advance/external-dependency"},{"text":"构建 umd 产物","link":"/zh/guide/advance/build-umd"},{"text":"处理静态文件","link":"/zh/guide/advance/asset"},{"text":"插件扩展","link":"/zh/guide/advance/extension"}]}]}]</script><script type="module" src="/assets/island_inject.69495876.js"></script>
+      <script type="module">import Le,{createContext as ke}from"react";import{jsx as Ce}from"react/jsx-runtime";const Ae="modulepreload",Ie=function(e){return"/"+e},ne={},Oe=function(t,n,i){return!n||n.length===0?t():Promise.all(n.map(r=>{if(r=Ie(r),r in ne)return;ne[r]=!0;const s=r.endsWith(".css"),p=s?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${r}"]${p}`))return;const a=document.createElement("link");if(a.rel=s?"stylesheet":Ae,s||(a.as="script",a.crossOrigin=""),a.href=r,document.head.appendChild(a),s)return new Promise((f,_)=>{a.addEventListener("load",f),a.addEventListener("error",()=>_(new Error(`Unable to preload CSS for ${r}`)))})})).then(()=>t())};const me=()=>typeof window<"u";ke({data:me()?window==null?void 0:window.ISLAND_PAGE_DATA:null,setData:e=>{}});const je="island-theme-appearance";let He,W,V;typeof window<"u"&&typeof localStorage<"u"&&(W=localStorage.getItem(je)||"auto",V=window.matchMedia("(prefers-color-scheme: dark)"),W==="auto"&&V.matches,V.onchange=e=>{W==="auto"&&Ne(e.matches)});const Ne=e=>{He[e?"add":"remove"]("dark")};var Re=typeof global=="object"&&global&&global.Object===Object&&global;const Pe=Re;var $e=typeof self=="object"&&self&&self.Object===Object&&self,De=Pe||$e||Function("return this")();const ue=De;var qe=ue.Symbol;const Y=qe;var pe=Object.prototype,Me=pe.hasOwnProperty,Be=pe.toString,D=Y?Y.toStringTag:void 0;function Ue(e){var t=Me.call(e,D),n=e[D];try{e[D]=void 0;var i=!0}catch{}var r=Be.call(e);return i&&(t?e[D]=n:delete e[D]),r}var We=Object.prototype,Ge=We.toString;function Fe(e){return Ge.call(e)}var Ye="[object Null]",Ke="[object Undefined]",oe=Y?Y.toStringTag:void 0;function Xe(e){return e==null?e===void 0?Ke:Ye:oe&&oe in Object(e)?Ue(e):Fe(e)}function Ze(e){return e!=null&&typeof e=="object"}var Ve="[object Symbol]";function Je(e){return typeof e=="symbol"||Ze(e)&&Xe(e)==Ve}var Qe=/\s/;function et(e){for(var t=e.length;t--&&Qe.test(e.charAt(t)););return t}var tt=/^\s+/;function nt(e){return e&&e.slice(0,et(e)+1).replace(tt,"")}function K(e){var t=typeof e;return e!=null&&(t=="object"||t=="function")}var re=0/0,ot=/^[-+]0x[0-9a-f]+$/i,rt=/^0b[01]+$/i,at=/^0o[0-7]+$/i,it=parseInt;function ae(e){if(typeof e=="number")return e;if(Je(e))return re;if(K(e)){var t=typeof e.valueOf=="function"?e.valueOf():e;e=K(t)?t+"":t}if(typeof e!="string")return e===0?e:+e;e=nt(e);var n=rt.test(e);return n||at.test(e)?it(e.slice(2),n?2:8):ot.test(e)?re:+e}var ct=function(){return ue.Date.now()};const J=ct;var st="Expected a function",dt=Math.max,lt=Math.min;function mt(e,t,n){var i,r,s,p,a,f,_=0,g=!1,w=!1,z=!0;if(typeof e!="function")throw new TypeError(st);t=ae(t)||0,K(n)&&(g=!!n.leading,w="maxWait"in n,s=w?dt(ae(n.maxWait)||0,t):s,z="trailing"in n?!!n.trailing:z);function L(h){var m=i,o=r;return i=r=void 0,_=h,p=e.apply(o,m),p}function E(h){return _=h,a=setTimeout(H,t),g?L(h):p}function A(h){var m=h-f,o=h-_,O=t-m;return w?lt(O,s-o):O}function M(h){var m=h-f,o=h-_;return f===void 0||m>=t||m<0||w&&o>=s}function H(){var h=J();if(M(h))return B(h);a=setTimeout(H,A(h))}function B(h){return a=void 0,z&&i?L(h):(i=r=void 0,p)}function x(){a!==void 0&&clearTimeout(a),_=0,i=f=r=a=void 0}function N(){return a===void 0?p:B(J())}function C(){var h=J(),m=M(h);if(i=arguments,r=this,f=h,m){if(a===void 0)return E(f);if(w)return clearTimeout(a),a=setTimeout(H,t),L(f)}return a===void 0&&(a=setTimeout(H,t)),p}return C.cancel=x,C.flush=N,C}var ut="Expected a function";function pt(e,t,n){var i=!0,r=!0;if(typeof e!="function")throw new TypeError(ut);return K(n)&&(i="leading"in n?!!n.leading:i,r="trailing"in n?!!n.trailing:r),mt(e,t,{leading:i,maxWait:t,trailing:r})}var ft=function(){var e=document.getSelection();if(!e.rangeCount)return function(){};for(var t=document.activeElement,n=[],i=0;i<e.rangeCount;i++)n.push(e.getRangeAt(i));switch(t.tagName.toUpperCase()){case"INPUT":case"TEXTAREA":t.blur();break;default:t=null;break}return e.removeAllRanges(),function(){e.type==="Caret"&&e.removeAllRanges(),e.rangeCount||n.forEach(function(r){e.addRange(r)}),t&&t.focus()}},gt=ft,ie={"text/plain":"Text","text/html":"Url",default:"Text"},vt="Copy to clipboard: #{key}, Enter";function ht(e){var t=(/mac os x/i.test(navigator.userAgent)?"\u2318":"Ctrl")+"+C";return e.replace(/#{\s*key\s*}/g,t)}function _t(e,t){var n,i,r,s,p,a,f=!1;t||(t={}),n=t.debug||!1;try{r=gt(),s=document.createRange(),p=document.getSelection(),a=document.createElement("span"),a.textContent=e,a.ariaHidden="true",a.style.all="unset",a.style.position="fixed",a.style.top=0,a.style.clip="rect(0, 0, 0, 0)",a.style.whiteSpace="pre",a.style.webkitUserSelect="text",a.style.MozUserSelect="text",a.style.msUserSelect="text",a.style.userSelect="text",a.addEventListener("copy",function(g){if(g.stopPropagation(),t.format)if(g.preventDefault(),typeof g.clipboardData>"u"){n&&console.warn("unable to use e.clipboardData"),n&&console.warn("trying IE specific stuff"),window.clipboardData.clearData();var w=ie[t.format]||ie.default;window.clipboardData.setData(w,e)}else g.clipboardData.clearData(),g.clipboardData.setData(t.format,e);t.onCopy&&(g.preventDefault(),t.onCopy(g.clipboardData))}),document.body.appendChild(a),s.selectNodeContents(a),p.addRange(s);var _=document.execCommand("copy");if(!_)throw new Error("copy command was unsuccessful");f=!0}catch(g){n&&console.error("unable to copy using execCommand: ",g),n&&console.warn("trying IE specific stuff");try{window.clipboardData.setData(t.format||"text",e),t.onCopy&&t.onCopy(window.clipboardData),f=!0}catch(w){n&&console.error("unable to copy using clipboardData: ",w),n&&console.error("falling back to prompt"),i=ht("message"in t?t.message:vt),window.prompt(i,e)}}finally{p&&(typeof p.removeRange=="function"?p.removeRange(s):p.removeAllRanges()),a&&document.body.removeChild(a),r()}return f}var yt=_t;function bt(){const e=new Map;window.addEventListener("click",t=>{var i;const n=t.target;if(n.matches('div[class*="language-"] > button.copy')){const r=n.parentElement,s=(i=n.nextElementSibling)==null?void 0:i.nextElementSibling;if(!r||!s)return;const{innerText:p=""}=s;if(yt(p)){n.classList.add("copied"),clearTimeout(e.get(n));const f=setTimeout(()=>{n.classList.remove("copied"),n.blur(),e.delete(n)},2e3);e.set(n,f)}}})}/*! medium-zoom 1.0.6 | MIT License | https://github.com/francoischalifour/medium-zoom */var j=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e},G=function(t){return t.tagName==="IMG"},wt=function(t){return NodeList.prototype.isPrototypeOf(t)},F=function(t){return t&&t.nodeType===1},ce=function(t){var n=t.currentSrc||t.src;return n.substr(-4).toLowerCase()===".svg"},se=function(t){try{return Array.isArray(t)?t.filter(G):wt(t)?[].slice.call(t).filter(G):F(t)?[t].filter(G):typeof t=="string"?[].slice.call(document.querySelectorAll(t)).filter(G):[]}catch{throw new TypeError(`The provided selector is invalid.
+Expects a CSS selector, a Node element, a NodeList or an array.
+See: https://github.com/francoischalifour/medium-zoom`)}},Et=function(t){var n=document.createElement("div");return n.classList.add("medium-zoom-overlay"),n.style.background=t,n},xt=function(t){var n=t.getBoundingClientRect(),i=n.top,r=n.left,s=n.width,p=n.height,a=t.cloneNode(),f=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,_=window.pageXOffset||document.documentElement.scrollLeft||document.body.scrollLeft||0;return a.removeAttribute("id"),a.style.position="absolute",a.style.top=i+f+"px",a.style.left=r+_+"px",a.style.width=s+"px",a.style.height=p+"px",a.style.transform="",a},P=function(t,n){var i=j({bubbles:!1,cancelable:!1,detail:void 0},n);if(typeof window.CustomEvent=="function")return new CustomEvent(t,i);var r=document.createEvent("CustomEvent");return r.initCustomEvent(t,i.bubbles,i.cancelable,i.detail),r},Tt=function e(t){var n=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},i=window.Promise||function(c){function d(){}c(d,d)},r=function(c){var d=c.target;if(d===O){E();return}x.indexOf(d)!==-1&&A({target:d})},s=function(){if(!(C||!o.original)){var c=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0;Math.abs(h-c)>m.scrollOffset&&setTimeout(E,150)}},p=function(c){var d=c.key||c.keyCode;(d==="Escape"||d==="Esc"||d===27)&&E()},a=function(){var c=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},d=c;if(c.background&&(O.style.background=c.background),c.container&&c.container instanceof Object&&(d.container=j({},m.container,c.container)),c.template){var v=F(c.template)?c.template:document.querySelector(c.template);d.template=v}return m=j({},m,d),x.forEach(function(y){y.dispatchEvent(P("medium-zoom:update",{detail:{zoom:b}}))}),b},f=function(){var c=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};return e(j({},m,c))},_=function(){for(var c=arguments.length,d=Array(c),v=0;v<c;v++)d[v]=arguments[v];var y=d.reduce(function(u,S){return[].concat(u,se(S))},[]);return y.filter(function(u){return x.indexOf(u)===-1}).forEach(function(u){x.push(u),u.classList.add("medium-zoom-image")}),N.forEach(function(u){var S=u.type,k=u.listener,R=u.options;y.forEach(function(I){I.addEventListener(S,k,R)})}),b},g=function(){for(var c=arguments.length,d=Array(c),v=0;v<c;v++)d[v]=arguments[v];o.zoomed&&E();var y=d.length>0?d.reduce(function(u,S){return[].concat(u,se(S))},[]):x;return y.forEach(function(u){u.classList.remove("medium-zoom-image"),u.dispatchEvent(P("medium-zoom:detach",{detail:{zoom:b}}))}),x=x.filter(function(u){return y.indexOf(u)===-1}),b},w=function(c,d){var v=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};return x.forEach(function(y){y.addEventListener("medium-zoom:"+c,d,v)}),N.push({type:"medium-zoom:"+c,listener:d,options:v}),b},z=function(c,d){var v=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};return x.forEach(function(y){y.removeEventListener("medium-zoom:"+c,d,v)}),N=N.filter(function(y){return!(y.type==="medium-zoom:"+c&&y.listener.toString()===d.toString())}),b},L=function(){var c=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},d=c.target,v=function(){var u={width:document.documentElement.clientWidth,height:document.documentElement.clientHeight,left:0,top:0,right:0,bottom:0},S=void 0,k=void 0;if(m.container)if(m.container instanceof Object)u=j({},u,m.container),S=u.width-u.left-u.right-m.margin*2,k=u.height-u.top-u.bottom-m.margin*2;else{var R=F(m.container)?m.container:document.querySelector(m.container),I=R.getBoundingClientRect(),X=I.width,ve=I.height,he=I.left,_e=I.top;u=j({},u,{width:X,height:ve,left:he,top:_e})}S=S||u.width-m.margin*2,k=k||u.height-m.margin*2;var $=o.zoomedHd||o.original,ye=ce($)?S:$.naturalWidth||S,be=ce($)?k:$.naturalHeight||k,U=$.getBoundingClientRect(),we=U.top,Ee=U.left,Q=U.width,ee=U.height,xe=Math.min(ye,S)/Q,Te=Math.min(be,k)/ee,Z=Math.min(xe,Te),Se=(-Ee+(S-Q)/2+m.margin+u.left)/Z,ze=(-we+(k-ee)/2+m.margin+u.top)/Z,te="scale("+Z+") translate3d("+Se+"px, "+ze+"px, 0)";o.zoomed.style.transform=te,o.zoomedHd&&(o.zoomedHd.style.transform=te)};return new i(function(y){if(d&&x.indexOf(d)===-1){y(b);return}var u=function X(){C=!1,o.zoomed.removeEventListener("transitionend",X),o.original.dispatchEvent(P("medium-zoom:opened",{detail:{zoom:b}})),y(b)};if(o.zoomed){y(b);return}if(d)o.original=d;else if(x.length>0){var S=x;o.original=S[0]}else{y(b);return}if(o.original.dispatchEvent(P("medium-zoom:open",{detail:{zoom:b}})),h=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,C=!0,o.zoomed=xt(o.original),document.body.appendChild(O),m.template){var k=F(m.template)?m.template:document.querySelector(m.template);o.template=document.createElement("div"),o.template.appendChild(k.content.cloneNode(!0)),document.body.appendChild(o.template)}if(document.body.appendChild(o.zoomed),window.requestAnimationFrame(function(){document.body.classList.add("medium-zoom--opened")}),o.original.classList.add("medium-zoom-image--hidden"),o.zoomed.classList.add("medium-zoom-image--opened"),o.zoomed.addEventListener("click",E),o.zoomed.addEventListener("transitionend",u),o.original.getAttribute("data-zoom-src")){o.zoomedHd=o.zoomed.cloneNode(),o.zoomedHd.removeAttribute("srcset"),o.zoomedHd.removeAttribute("sizes"),o.zoomedHd.src=o.zoomed.getAttribute("data-zoom-src"),o.zoomedHd.onerror=function(){clearInterval(R),console.warn("Unable to reach the zoom image target "+o.zoomedHd.src),o.zoomedHd=null,v()};var R=setInterval(function(){o.zoomedHd.complete&&(clearInterval(R),o.zoomedHd.classList.add("medium-zoom-image--opened"),o.zoomedHd.addEventListener("click",E),document.body.appendChild(o.zoomedHd),v())},10)}else if(o.original.hasAttribute("srcset")){o.zoomedHd=o.zoomed.cloneNode(),o.zoomedHd.removeAttribute("sizes"),o.zoomedHd.removeAttribute("loading");var I=o.zoomedHd.addEventListener("load",function(){o.zoomedHd.removeEventListener("load",I),o.zoomedHd.classList.add("medium-zoom-image--opened"),o.zoomedHd.addEventListener("click",E),document.body.appendChild(o.zoomedHd),v()})}else v()})},E=function(){return new i(function(c){if(C||!o.original){c(b);return}var d=function v(){o.original.classList.remove("medium-zoom-image--hidden"),document.body.removeChild(o.zoomed),o.zoomedHd&&document.body.removeChild(o.zoomedHd),document.body.removeChild(O),o.zoomed.classList.remove("medium-zoom-image--opened"),o.template&&document.body.removeChild(o.template),C=!1,o.zoomed.removeEventListener("transitionend",v),o.original.dispatchEvent(P("medium-zoom:closed",{detail:{zoom:b}})),o.original=null,o.zoomed=null,o.zoomedHd=null,o.template=null,c(b)};C=!0,document.body.classList.remove("medium-zoom--opened"),o.zoomed.style.transform="",o.zoomedHd&&(o.zoomedHd.style.transform=""),o.template&&(o.template.style.transition="opacity 150ms",o.template.style.opacity=0),o.original.dispatchEvent(P("medium-zoom:close",{detail:{zoom:b}})),o.zoomed.addEventListener("transitionend",d)})},A=function(){var c=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},d=c.target;return o.original?E():L({target:d})},M=function(){return m},H=function(){return x},B=function(){return o.original},x=[],N=[],C=!1,h=0,m=n,o={original:null,zoomed:null,zoomedHd:null,template:null};Object.prototype.toString.call(t)==="[object Object]"?m=t:(t||typeof t=="string")&&_(t),m=j({margin:0,background:"#fff",scrollOffset:40,container:null,template:null},m);var O=Et(m.background);document.addEventListener("click",r),document.addEventListener("keyup",p),document.addEventListener("scroll",s),window.addEventListener("resize",E);var b={open:L,close:E,toggle:A,update:a,clone:f,attach:_,detach:g,on:w,off:z,getOptions:M,getImages:H,getZoomedImage:B};return b};function St(e,t){t===void 0&&(t={});var n=t.insertAt;if(!(!e||typeof document>"u")){var i=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css",n==="top"&&i.firstChild?i.insertBefore(r,i.firstChild):i.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}var zt=".medium-zoom-overlay{position:fixed;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .3s;will-change:opacity}.medium-zoom--opened .medium-zoom-overlay{cursor:pointer;cursor:zoom-out;opacity:1}.medium-zoom-image{cursor:pointer;cursor:zoom-in;transition:transform .3s cubic-bezier(.2,0,.2,1)!important}.medium-zoom-image--hidden{visibility:hidden}.medium-zoom-image--opened{position:relative;cursor:pointer;cursor:zoom-out;will-change:transform}";St(zt);const Lt=Tt,kt=60;function Ct(){function e(t,n,i=!1){let r=null;try{r=t.classList.contains("header-anchor")?t:document.getElementById(decodeURIComponent(n.slice(1)))}catch(s){console.warn(s)}if(r){const s=parseInt(window.getComputedStyle(r).paddingTop,10),p=window.scrollY+r.getBoundingClientRect().top-kt+s;window.scrollTo({left:0,top:p,...i?{behavior:"smooth"}:{}})}}window.addEventListener("click",t=>{const n=t.target.closest("a");if(n){const{origin:i,hash:r,target:s,pathname:p,search:a}=n,f=window.location;r&&s!=="_blank"&&i===f.origin&&p===f.pathname&&a===f.search&&r&&r!==f.hash&&n.classList.contains("header-anchor")&&(t.preventDefault(),history.pushState(null,"",r),e(n,r,!0),window.dispatchEvent(new Event("hashchange")))}},{capture:!0}),window.addEventListener("hashchange",t=>{t.preventDefault()})}function At(){function e(){return document.documentElement.scrollTop+window.innerHeight>=document.documentElement.scrollHeight}const t=60,n=document.getElementById("aside-marker"),i=document.getElementById("aside-container"),r=document.querySelectorAll(".island-doc .header-anchor");let s=null;const p=Array.from((i==null?void 0:i.getElementsByTagName("a"))||[]).map(g=>decodeURIComponent(g.hash));if(n&&!p.length){n.style.opacity="0";return}const a=(g,w)=>{if(s&&s.classList.remove("aside-active"),g[w]){g[w].classList.add("aside-active");const z=g[w].getAttribute("href"),L=p.findIndex(A=>A===z),E=i==null?void 0:i.querySelector(`a[href="#${z==null?void 0:z.slice(1)}"]`);E&&(s=E,s.classList.add("aside-active"),n.style.top=`${33+L*28}px`,n.style.opacity="1")}},f=()=>{if(e())a(r,r.length-1);else for(let g=0;g<r.length;g++){const w=r[g],z=r[g+1],L=window.scrollY,E=w.parentElement.offsetTop-t;if(g===0&&L===0&&a(r,0),!z){a(r,g);break}const A=z.parentElement.offsetTop-t;if(L>E&&L<A){a(r,g);break}}},_=pt(f,100);return requestAnimationFrame(f),window.addEventListener("scroll",_),()=>{window.removeEventListener("scroll",_)}}function It(){const e=document.querySelectorAll("img");Lt(e,{margin:100,background:"rgba(0, 0, 0, 0.7)"})}function Ot(){!me()||(At(),Ct(),bt(),It())}if(typeof window<"u"){var de={get passive(){}};window.addEventListener("testPassive",null,de),window.removeEventListener("testPassive",null,de)}typeof window<"u"&&window.navigator&&window.navigator.platform&&(/iP(ad|hone|od)/.test(window.navigator.platform)||window.navigator.platform==="MacIntel"&&window.navigator.maxTouchPoints>1);var l={exports:{}},jt="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED",Ht=jt,Nt=Ht;function fe(){}function ge(){}ge.resetWarningCache=fe;var Rt=function(){function e(i,r,s,p,a,f){if(f!==Nt){var _=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw _.name="Invariant Violation",_}}e.isRequired=e;function t(){return e}var n={array:e,bigint:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:ge,resetWarningCache:fe};return n.PropTypes=n,n};l.exports=Rt();var q={BASE:"base",BODY:"body",HEAD:"head",HTML:"html",LINK:"link",META:"meta",NOSCRIPT:"noscript",SCRIPT:"script",STYLE:"style",TITLE:"title",FRAGMENT:"Symbol(react.fragment)"};Object.keys(q).map(function(e){return q[e]});var le={accesskey:"accessKey",charset:"charSet",class:"className",contenteditable:"contentEditable",contextmenu:"contextMenu","http-equiv":"httpEquiv",itemprop:"itemProp",tabindex:"tabIndex"};Object.keys(le).reduce(function(e,t){return e[le[t]]=t,e},{});q.NOSCRIPT,q.SCRIPT,q.STYLE;Le.createContext({});var Pt=l.exports.shape({setHelmet:l.exports.func,helmetInstances:l.exports.shape({get:l.exports.func,add:l.exports.func,remove:l.exports.func})});l.exports.shape({helmet:l.exports.shape()}),l.exports.node.isRequired;Pt.isRequired;l.exports.object,l.exports.object,l.exports.oneOfType([l.exports.arrayOf(l.exports.node),l.exports.node]),l.exports.string,l.exports.bool,l.exports.bool,l.exports.object,l.exports.arrayOf(l.exports.object),l.exports.arrayOf(l.exports.object),l.exports.arrayOf(l.exports.object),l.exports.func,l.exports.arrayOf(l.exports.object),l.exports.arrayOf(l.exports.object),l.exports.string,l.exports.object,l.exports.string,l.exports.bool,l.exports.object;async function $t(){if(!document.getElementById("root"))throw new Error("#root element not found");{const t=document.querySelectorAll("[__island]");if(t.length===0)return;const{hydrateRoot:n}=await Oe(()=>import("react-dom/client"),[]);for(let i=0;i<t.length;i++){const r=t[i],[s,p]=r.getAttribute("__island").split(":"),a=window.ISLANDS[s];n(r,Ce(a,{...window.ISLAND_PROPS[p]}))}}}$t().then(()=>{setTimeout(()=>{Ot()})});
+</script>
+    </body>
+  </html>

package/docs/.island/dist/zh/guide/advance/build-umd.html ADDED Viewed

@@ -0,0 +1,72 @@
+<!DOCTYPE html>
+  <html>
+    <head>
+      <meta charset="utf-8">
+      <meta name="viewport" content="width=device-width,initial-scale=1">
+      <link rel="icon" href="" type="image/svg+xml"></link>
+      <script  id="check-dark-light">
+        ;(() => {
+          const saved = localStorage.getItem('island-theme-appearance')
+          const prefereDark = window.matchMedia('(prefers-color-scheme: dark)').matches
+          if (!saved || saved === 'auto' ? prefereDark : saved === 'dark') {
+            document.documentElement.classList.add('dark')
+          }
+        })()
+      </script>
+      <title data-rh="true">构建 umd 产物</title>
+      <meta data-rh="true" name="description" content="Island"/>
+      <script defer src='https://ga.jspm.io/npm:es-module-shims@1.6.0/dist/es-module-shims.js'></script>
+      <script type="importmap">
+        {
+          "imports": {
+            "react": "/react.js","react-dom": "/react-dom.js","react-dom/client": "/react-dom_client.js","react/jsx-runtime": "/react_jsx-runtime.js"
+          }
+        }
+      </script>
+      <link rel="stylesheet" href="/assets/style.2e5f7bc2.css">
+    </head>
+    <body>
+      <div id="root"><div style="height:100%"><header relative="" z="4" fixed="md:~" class="top-0 left-0" w="100%"><div relative="" p="l-8 sm:x-8" transition="background-color duration-500" class="divider-bottom md:border-b-transparent lg:border-b-transparent" nav-h="mobile lg:desktop"><div flex="" justify="between" m="0 auto" nav-h="mobile lg:desktop" class="_container_1ic07_52  _has-sidebar_1ic07_16"><div shrink="0" border="border t-0 b-1 border-solid transparent" class="_nav-bar-title_1ic07_16"><a href="/zh/" w="100%" h="100%" text="1rem" font="semibold" transition="opacity duration-300" hover="opacity-60" class="flex items-center"><span>Module tools</span></a></div><div class="_content_1ic07_24" flex="~ 1" justify="end" items-center=""><div class="search" flex="sm:1" pl="sm:8"><div __island="Search:1"><div flex="" items-center="~" relative="" mr="2" font="semibold"><svg width="32" height="32" viewBox="0 0 32 32" w="5" h="5" fill="currentColor"><path fill="#888888" d="m29 27.586l-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9a9.01 9.01 0 0 1-9-9Z"></path></svg><input disabled="" cursor="text focus:auto" placeholder="Search" height="8" border="none" type="text" text="sm" p="t-0 r-2 b-0 l-2" transition="all duration-200 ease" class="rounded-sm _searchInput_y03a3_1 " aria-label="Search" autoComplete="off"/><div m="r-3" w="10" h="6" p="x-1.5" rounded="md" border="1px solid gray-light-3" text="xs gray-light-3" flex="~" items-center="~" justify="around" class="_searchCommand_y03a3_7"><span>⌘</span><span>K</span></div></div></div></div><div class="_rightNav_1ic07_42"><div class="menu"><div text="sm" font="medium" m="x-3" class="text-brand"><a href="/zh/guide/intro/welcome.html" target="" class="_link_r3fql_1 ">指南</a></div><div text="sm" font="medium" m="x-3" class=""><a href="/zh/api/index.html" target="" class="_link_r3fql_1 ">API</a></div><div m="x-3" last="mr-0"><div __island="NavMenuGroup:4"><div relative=""><button flex="center" nav-h="mobile sm:desktop" font="medium" text="sm text-1 hover:text-2" transition="color duration-200" class="nav-menu-group-button"><span mr="1" text="sm" font="medium">v2.0.0-beta.4</span><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M16 22L6 12l1.4-1.4l8.6 8.6l8.6-8.6L26 12z"></path></svg></button><div absolute="" pos="top-13 right-0" m="x-0.8" transition="opacity duration-300" class="nav-menu-group-content" style="opacity:0;visibility:hidden"><div p="3" w="100%" h="100%" class="min-w-128px max-h-100vh" border-1="" rounded="xl" bg="bg-default" style="box-shadow:var(--island-shadow-3);margin-right:-1.5rem;z-index:100"><div font="medium"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer" class="_link_r3fql_1 "><div rounded="md" hover="bg-bg-mute" p="y-1.6 l-3"><div flex=""><span mr="1">更新日志</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div><div font="medium"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer" class="_link_r3fql_1 "><div rounded="md" hover="bg-bg-mute" p="y-1.6 l-3"><div flex=""><span mr="1">贡献指南</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div></div></div></div></div></div></div><div class="translation" flex="~" text="sm" font="bold" items-center="~" before="menu-item-before"><div m="x-1.5"><div __island="NavMenuGroup:5"><div relative=""><button flex="center" nav-h="mobile sm:desktop" font="medium" text="sm text-1 hover:text-2" transition="color duration-200" class="nav-menu-group-button"><span mr="1" text="sm" font="medium"><svg width="32" height="32" viewBox="0 0 32 32" w="18px" h="18px"><path fill="currentColor" d="M27.85 29H30l-6-15h-2.35l-6 15h2.15l1.6-4h6.85zm-7.65-6l2.62-6.56L25.45 23zM18 7V5h-7V2H9v3H2v2h10.74a14.71 14.71 0 0 1-3.19 6.18A13.5 13.5 0 0 1 7.26 9h-2.1a16.47 16.47 0 0 0 3 5.58A16.84 16.84 0 0 1 3 18l.75 1.86A18.47 18.47 0 0 0 9.53 16a16.92 16.92 0 0 0 5.76 3.84L16 18a14.48 14.48 0 0 1-5.12-3.37A17.64 17.64 0 0 0 14.8 7z"></path></svg></span><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M16 22L6 12l1.4-1.4l8.6 8.6l8.6-8.6L26 12z"></path></svg></button><div absolute="" pos="top-13 right-0" m="x-0.8" transition="opacity duration-300" class="nav-menu-group-content" style="opacity:0;visibility:hidden"><div p="3" w="100%" h="100%" class="min-w-128px max-h-100vh" border-1="" rounded="xl" bg="bg-default" style="box-shadow:var(--island-shadow-3);margin-right:-1.5rem;z-index:100"><div rounded="md" p="y-1.6 l-3"><span mr="1" text="brand">简体中文</span></div><div font="medium"><a href="/en" target="" class="_link_r3fql_1 "><div rounded="md" hover="bg-bg-mute" p="y-1.6 l-3"><div flex=""><span mr="1">English</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div></div></div></div></div></div></div><div class="appearance" before="menu-item-before" display="none sm:flex" items-center="center"><div __island="SwitchAppearance:6"><button class="_switch_1tqe3_1 undefined" id="" type="button" role="switch"><span class="_check_1tqe3_17"><span class="_icon_1tqe3_34"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewBox="0 0 24 24" class="_sun_8e60k_1"><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewBox="0 0 24 24" class="_moon_8e60k_5"><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg></span></span></button></div></div><div __island="SocialLinks:2"><div class="social-links" nav-h="mobile sm:desktop" flex="" items-center="" before="menu-item-before" relative=""><div h="100%" flex="" gap="x-4" items-center="" transition="color duration-300"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer"><div class="_social-links-icon_wx6p9_1"><svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></div></a></div></div></div></div><div __island="NavHamburger:3"><button class=" _navHamburger_14nz8_1"><span class="_container_14nz8_14"><span class="_top_14nz8_21"></span><span class="_middle_14nz8_27"></span><span class="_bottom_14nz8_33"></span></span></button><div class="_navScreen_1mkpq_1 " id="navScreen"><div class="_container_1mkpq_21"><div class="_navMenu_1mkpq_27"><div w="100%" class="_navMenuItem_1mkpq_34"><div text="sm" font="medium" m="x-3" class="text-brand"><a href="/zh/guide/intro/welcome.html" target="" class="_link_r3fql_1 ">指南</a></div></div><div w="100%" class="_navMenuItem_1mkpq_34"><div text="sm" font="medium" m="x-3" class=""><a href="/zh/api/index.html" target="" class="_link_r3fql_1 ">API</a></div></div><div w="100%" class="_navMenuItem_1mkpq_34"><div m="x-3" last="mr-0"><div relative="" class=" _navScreenMenuGroup_1xte3_1"><button class="_button_1xte3_12"><span class="_buttonSpan_1xte3_25">v2.0.0-beta.4</span><svg width="1em" height="1em" viewBox="0 0 32 32" class=" _down_1xte3_40 "><path fill="currentColor" d="M16 22L6 12l1.4-1.4l8.6 8.6l8.6-8.6L26 12z"></path></svg></button><div><div class="_items_1xte3_32"><div class="pa-1" font="medium"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer" class="_link_r3fql_1 "><div><div flex=""><span mr="1">更新日志</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div><div class="pa-1" font="medium"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer" class="_link_r3fql_1 "><div><div flex=""><span mr="1">贡献指南</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div></div></div></div></div></div></div><div class="_socialAndAppearance_1mkpq_50" flex="~" justify="center" items-center="center"><div class="items-center appearance pa-2 _navAppearance_1mkpq_46" flex="~" justify="center"><button class="_switch_1tqe3_1 undefined" id="" type="button" role="switch"><span class="_check_1tqe3_17"><span class="_icon_1tqe3_34"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewBox="0 0 24 24" class="_sun_8e60k_1"><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewBox="0 0 24 24" class="_moon_8e60k_5"><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg></span></span></button></div><div __island="SocialLinks:7"><div class="social-links" nav-h="mobile sm:desktop" flex="" items-center="" before="menu-item-before" relative=""><div h="100%" flex="" gap="x-4" items-center="" transition="color duration-300"><a href="https://github.com/modern-js-dev/modern.js" target="_blank" rel="noopener noreferrer"><div class="_social-links-icon_wx6p9_1"><svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></div></a></div></div></div></div><div flex="~" text="sm" font="bold" justify="center"><div m="x-1.5"><div relative="" class=" _navScreenMenuGroup_1xte3_1"><button class="_button_1xte3_12"><span class="_buttonSpan_1xte3_25"><svg width="32" height="32" viewBox="0 0 32 32" w="18px" h="18px"><path fill="currentColor" d="M27.85 29H30l-6-15h-2.35l-6 15h2.15l1.6-4h6.85zm-7.65-6l2.62-6.56L25.45 23zM18 7V5h-7V2H9v3H2v2h10.74a14.71 14.71 0 0 1-3.19 6.18A13.5 13.5 0 0 1 7.26 9h-2.1a16.47 16.47 0 0 0 3 5.58A16.84 16.84 0 0 1 3 18l.75 1.86A18.47 18.47 0 0 0 9.53 16a16.92 16.92 0 0 0 5.76 3.84L16 18a14.48 14.48 0 0 1-5.12-3.37A17.64 17.64 0 0 0 14.8 7z"></path></svg></span><svg width="1em" height="1em" viewBox="0 0 32 32" class=" _down_1xte3_40 "><path fill="currentColor" d="M16 22L6 12l1.4-1.4l8.6 8.6l8.6-8.6L26 12z"></path></svg></button><div><div class="_items_1xte3_32"><div class="pa-1"><span mr="1" text="brand">简体中文</span></div><div class="pa-1" font="medium"><a href="/en" target="" class="_link_r3fql_1 "><div><div flex=""><span mr="1">English</span><svg width="32" height="32" viewBox="0 0 32 32" w="11px" h="11px" text="text-3" m="t-1 r-1"><path fill="currentColor" d="M10 6v2h12.59L6 24.59L7.41 26L24 9.41V22h2V6H10z"></path></svg></div></div></a></div></div></div></div></div></div></div></div></div></div></div></div></header><section style="padding-top:var(--island-nav-height)"><div p="t-0 x-6 b-24 sm:6" class="_docLayout_5cssi_8"><div __island="SideMenu:8"><div class="_localNav_ncerp_1"><button flex="center" class="_menu_ncerp_16"><div text="md" mr="2" class="i-carbon:menu"></div><span text="md ">Menu</span></button></div><aside class="_sidebar_iav29_1 "><nav><section block="~" not-first="divider-top mt-4"><div flex="~" justify="between" items-start="~" class="items-center"><h2 m="t-3 b-2" text="1rem text-1" font="bold">介绍</h2></div><div mb="1.4 sm:1" style="height:auto;display:block"><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/intro/welcome.html" target="" class="_link_r3fql_1 ">欢迎使用</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/intro/why-module-engineering-solution.html" target="" class="_link_r3fql_1 ">为什么需要模块工程解决方案</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/intro/getting-started.html" target="" class="_link_r3fql_1 ">快速开始</a></div></div></div></div></section><section block="~" not-first="divider-top mt-4"><div flex="~" justify="between" items-start="~" class="items-center"><h2 m="t-3 b-2" text="1rem text-1" font="bold">基础使用</h2></div><div mb="1.4 sm:1" style="height:auto;display:block"><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/before-getting-started.html" target="" class="_link_r3fql_1 ">开始之前</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/command-preview.html" target="" class="_link_r3fql_1 ">命令预览</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/modify-output-product.html" target="" class="_link_r3fql_1 ">修改输出产物</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/use-micro-generator.html" target="" class="_link_r3fql_1 ">使用微生成器</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/using-storybook.html" target="" class="_link_r3fql_1 ">使用 Storybook</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/test-your-project.html" target="" class="_link_r3fql_1 ">测试项目</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/basic/publish-your-project.html" target="" class="_link_r3fql_1 ">发布项目</a></div></div></div></div></section><section block="~" not-first="divider-top mt-4"><div flex="~" justify="between" items-start="~" class="items-center"><h2 m="t-3 b-2" text="1rem text-1" font="bold">进阶指南</h2></div><div mb="1.4 sm:1" style="height:auto;display:block"><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/advance/in-depth-about-build.html" target="" class="_link_r3fql_1 ">深入理解构建</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/advance/in-depth-about-dev-command.html" target="" class="_link_r3fql_1 ">深入理解 dev 命令</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/advance/copy.html" target="" class="_link_r3fql_1 ">使用 Copy 工具</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/advance/external-dependency.html" target="" class="_link_r3fql_1 ">如何处理第三方依赖</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-brand"><a href="/zh/guide/advance/build-umd.html" target="" class="_link_r3fql_1 ">构建 umd 产物</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/advance/asset.html" target="" class="_link_r3fql_1 ">处理静态文件</a></div></div></div><div><div style="margin-left:0px"><div p="1" block="~" text="sm" font-medium="~" class="text-text-2"><a href="/zh/guide/advance/extension.html" target="" class="_link_r3fql_1 ">插件扩展</a></div></div></div></div></section></nav></aside></div><div flex="~ 1 shrink-0" m="x-auto" class="_content_5cssi_2"><div m="x-auto" flex="~ col" class="max-w-100%"><div relative="~" m="x-auto" p="l-2" class="w-100% md:max-w-712px lg:min-w-640px "><div class="island-doc "><!--$--><h1 id="构建-umd-产物"><a class="header-anchor" aria-hidden="true" href="#构建-umd-产物">#</a>构建 umd 产物</h1>
+<p>umd 全称为 <strong>Universal Module Definition</strong>，这种格式的 JS 文件可以运行在多个运行环境：</p>
+<ul>
+<li>浏览器环境：基于 AMD 规范进行模块加载</li>
+<li>Node.js 环境：基于 CommonJS 进行模块加载</li>
+<li>其他情况：将模块挂载在全局对象上。</li>
+</ul>
+<p>因此我们可以通过下面的方式，将项目的构建产物指定为 umd 产物：</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>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>
+<h2 id="umd-产物的第三方依赖处理"><a class="header-anchor" aria-hidden="true" href="#umd-产物的第三方依赖处理">#</a>umd 产物的第三方依赖处理</h2>
+<p>在 <a href="/zh/guide/advance/external-dependency.html">【如何处理第三方依赖】</a> 章节中，我们知道可以通过 <a href="/zh/api/build-config.html#autoexternal"><code>autoExternals</code></a> 和 <a href="/zh/api/build-config.html#externals"><code>externals</code></a> API 来控制项目是否对第三方依赖打包。
+因此在构建 umd 产物的过程中，我们也可以这样使用：</p>
+<section class="ch-spotlight  "><div class="ch-spotlight-tabs"><div></div><div class="ch-spotlight-tab"><p>如果项目依赖了 <code>react</code>。</p></div><div class="ch-spotlight-tab"><p><code>modern.config.ts</code> 配置。</p></div><div class="ch-spotlight-tab"><p>当源码中使用了 <code>react</code> 依赖。</p></div><div class="ch-spotlight-tab"><p>此时产物中不会将 <code>react</code> 代码打包到产物中。</p></div></div><div class="ch-spotlight-sticker"><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="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"></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;dependencies&quot;: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>    &quot;react&quot;: &quot;^17&quot;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>    //...other dependencies</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></section>
+<p>通过上面的例子我们知道，当使用 <code>autoExternal</code> 和 <code>externals</code> API 后：</p>
+<ul>
+<li>在 Node.js 环境下，可以通过 <code>require(&#x27;react&#x27;)</code> 获取 react 依赖。</li>
+<li>在 浏览器环境下，可以通过 <code>global.react</code> 获取 react 依赖。</li>
+</ul>
+<p>然而在浏览器环境下，获取第三方依赖的时候，<strong>全局变量名称不一定与依赖名称完全相同</strong>，此时就要使用 <a href="/zh/api/build-config.html#umdglobals"><code>buildConfig.umdGlobals</code></a> API。</p>
+<p>还是使用之前的例子，当 <code>react</code> 依赖以 <code>windows.React</code> 或者 <code>global.React</code> 全局变量的形式存在于浏览器环境下，那么此时：</p>
+<section class="ch-spotlight  "><div class="ch-spotlight-tabs"><div></div><div class="ch-spotlight-tab"><p>如果项目依赖了 <code>react</code>。</p></div><div class="ch-spotlight-tab"><p><code>modern.config.ts</code> 配置。</p></div><div class="ch-spotlight-tab"><p>当源码中使用了 <code>react</code> 依赖。</p></div><div class="ch-spotlight-tab"><p>此时我们会看到这样的产物代码。</p></div></div><div class="ch-spotlight-sticker"><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="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"></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;devDependencies&quot;: {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>    &quot;react&quot;: &quot;^17&quot;</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></section>
+<p>此时项目就可以运行在浏览器中，并使用存在于全局对象上的 <code>React</code> 变量了。</p>
+<h2 id="更改项目的全局变量名称"><a class="header-anchor" aria-hidden="true" href="#更改项目的全局变量名称">#</a>更改项目的全局变量名称</h2>
+<p>当我们将下面的代码打包成 umd 产物并运行在浏览器的时候，我们可以通过 <code>window.index</code> 来使用该模块。</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="./src/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">./src/</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>export default () =&gt; {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>  console.info(&#x27;hello world&#x27;);</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>}</span></div></div><br/></code></div></div></div></div>
+<p><strong>默认情况下，以源码文件名称作为该模块在浏览器里全局变量的名称</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="./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>(function(global, factory) {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>    if (typeof module === &quot;object&quot; &amp;&amp; typeof module.exports === &quot;object&quot;) factory(exports);</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>    else if (typeof define === &quot;function&quot; &amp;&amp; define.amd) define([</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>        &quot;exports&quot;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>    ], factory);</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>    else if (global = typeof globalThis !== &quot;undefined&quot; ? globalThis : global || self) factory(global.index = {});</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>})(this, function(exports) {</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>如果需要修改它，则需要使用 <a href="/zh/api/build-config.html#umdmodulename"><code>buildConfig.umdModuleName</code></a> API。</p>
+<p>当使用该 API 后：</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>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>    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>此时构建产物的内容为：</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="./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>(function(global, factory) {</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>    if (typeof module === &quot;object&quot; &amp;&amp; typeof module.exports === &quot;object&quot;) factory(exports);</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>    else if (typeof define === &quot;function&quot; &amp;&amp; define.amd) define([</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>        &quot;exports&quot;</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>    ], factory);</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>    else if (global = typeof globalThis !== &quot;undefined&quot; ? globalThis : global || self) factory(global.myLib = {});</span></div></div><div><div style="display:inline-block;margin-left:16px"><span>})(this, function(exports) {</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 mt="8"><div class="xs:flex" p="b-5" justify="between" items-center="~"><a flex="~" items-center="" leading-8="" font-medium="~" text="sm brand" hover="text-brand-dark" href="https://github.com/modern-js-dev/modern.js/tree/next/website/module-tools/docs/zh/guide/advance/build-umd.mdx" transition="color duration-300">📝 在 GitHub 上编辑此页</a><div flex="" text="sm text-2" leading-6="~" leading-8="sm:~" font-medium=""><p>上次更新: </p><span>2022/12/16 11:50:03</span></div></div><div flex="~ col sm:row" justify="sm:around" gap="2" divider-top="" pt="6"><div flex="~ col" class="_prev_1f77m_13"><a href="/zh/guide/advance/external-dependency.html" class="_pager-link_1f77m_20"><span class="_desc_1f77m_43">上一页</span><span class="_title_1f77m_34">如何处理第三方依赖</span></a></div><div flex="~ col" class="_next_1f77m_16"><a href="/zh/guide/advance/asset.html" class="_pager-link_1f77m_20 _next_1f77m_16"><span class="_desc_1f77m_43">下一页</span><span class="_title_1f77m_34">处理静态文件</span></a></div></div></footer></div></div><div relative="~" display="none lg:block" order="2" flex="1" p="l-8" class="max-w-256px"><div class="_aside-container_5cssi_32"><div flex="~ col" p="b-8" style="min-height:calc(100vh - (var(--island-nav-height-desktop) + 32px))"><div><div flex="~ col 1"><div display="lg:block"><div relative="" divider-left="" p="l-4" text="13px" font-medium="" id="aside-container"><div absolute="" pos="top-33px" opacity="0" w="1px" h="18px" bg="brand" style="left:-1px;transition:top 0.25s cubic-bezier(0, 1, 0.5, 1), background-color 0.5s, opacity 0.25s" id="aside-marker"></div><div block="~" leading-7="" text="13px" font="semibold">目录</div><nav><ul relative=""><li><a href="#umd-产物的第三方依赖处理" block="" leading-7="" text="text-2" avoid-text-overflow="" hover="text-text-1" transition="color duration-300" style="padding-left:0">umd 产物的第三方依赖处理</a></li><li><a href="#更改项目的全局变量名称" block="" leading-7="" text="text-2" avoid-text-overflow="" hover="text-text-1" transition="color duration-300" style="padding-left:0">更改项目的全局变量名称</a></li></ul></nav></div></div></div></div></div></div></div></div></div></section><div __island="BackTop:0"></div></div></div>
+      <script id="island-props">[{},{"langRoutePrefix":"/zh/"},{"socialLinks":[{"icon":"github","mode":"link","content":"https://github.com/modern-js-dev/modern.js"}]},{"localeData":{"lang":"zh","label":"简体中文","lastUpdatedText":"上次更新","nav":[{"text":"指南","link":"/zh/guide/intro/welcome","activeMatch":"/guide/"},{"text":"API","link":"/zh/api/","activeMatch":"/api/"},{"text":"v2.0.0-beta.4","items":[{"text":"更新日志","link":"https://github.com/modern-js-dev/modern.js"},{"text":"贡献指南","link":"https://github.com/modern-js-dev/modern.js"}]}],"sidebar":{"/zh/guide/":[{"text":"介绍","items":[{"text":"欢迎使用","link":"/zh/guide/intro/welcome"},{"text":"为什么需要模块工程解决方案","link":"/zh/guide/intro/why-module-engineering-solution"},{"text":"快速开始","link":"/zh/guide/intro/getting-started"}]},{"text":"基础使用","items":[{"text":"开始之前","link":"/zh/guide/basic/before-getting-started"},{"text":"命令预览","link":"/zh/guide/basic/command-preview"},{"text":"修改输出产物","link":"/zh/guide/basic/modify-output-product"},{"text":"使用微生成器","link":"/zh/guide/basic/use-micro-generator"},{"text":"使用 Storybook","link":"/zh/guide/basic/using-storybook"},{"text":"测试项目","link":"/zh/guide/basic/test-your-project"},{"text":"发布项目","link":"/zh/guide/basic/publish-your-project"}]},{"text":"进阶指南","items":[{"text":"深入理解构建","link":"/zh/guide/advance/in-depth-about-build"},{"text":"深入理解 dev 命令","link":"/zh/guide/advance/in-depth-about-dev-command"},{"text":"使用 Copy 工具","link":"/zh/guide/advance/copy"},{"text":"如何处理第三方依赖","link":"/zh/guide/advance/external-dependency"},{"text":"构建 umd 产物","link":"/zh/guide/advance/build-umd"},{"text":"处理静态文件","link":"/zh/guide/advance/asset"},{"text":"插件扩展","link":"/zh/guide/advance/extension"}]}],"/zh/api/":[{"text":"配置项","items":[{"text":"BuildConfig","link":"/zh/api/build-config"},{"text":"BuildPreset","link":"/zh/api/build-preset"},{"text":"Dev","link":"/zh/api/dev"},{"text":"Test","link":"/zh/api/test"},{"text":"Plugin","link":"/zh/api/plugin"},{"text":"DesignSystem","link":"/zh/api/design-system"}]}]},"title":"Module tools","outlineTitle":"目录","prevPageText":"上一页","nextPageText":"下一页","description":"模块工程解决方案","editLink":{"pattern":"https://github.com/modern-js-dev/modern.js/tree/next/website/module-tools/docs/:path","text":"📝 在 GitHub 上编辑此页"},"langRoutePrefix":"/zh/"},"siteData":{"lang":"en-US","title":"Module tools","description":"Island","themeConfig":{"locales":{"/zh/":{"lang":"zh","label":"简体中文","lastUpdatedText":"上次更新","nav":[{"text":"指南","link":"/zh/guide/intro/welcome","activeMatch":"/guide/"},{"text":"API","link":"/zh/api/","activeMatch":"/api/"},{"text":"v2.0.0-beta.4","items":[{"text":"更新日志","link":"https://github.com/modern-js-dev/modern.js"},{"text":"贡献指南","link":"https://github.com/modern-js-dev/modern.js"}]}],"sidebar":{"/zh/guide/":[{"text":"介绍","items":[{"text":"欢迎使用","link":"/zh/guide/intro/welcome"},{"text":"为什么需要模块工程解决方案","link":"/zh/guide/intro/why-module-engineering-solution"},{"text":"快速开始","link":"/zh/guide/intro/getting-started"}]},{"text":"基础使用","items":[{"text":"开始之前","link":"/zh/guide/basic/before-getting-started"},{"text":"命令预览","link":"/zh/guide/basic/command-preview"},{"text":"修改输出产物","link":"/zh/guide/basic/modify-output-product"},{"text":"使用微生成器","link":"/zh/guide/basic/use-micro-generator"},{"text":"使用 Storybook","link":"/zh/guide/basic/using-storybook"},{"text":"测试项目","link":"/zh/guide/basic/test-your-project"},{"text":"发布项目","link":"/zh/guide/basic/publish-your-project"}]},{"text":"进阶指南","items":[{"text":"深入理解构建","link":"/zh/guide/advance/in-depth-about-build"},{"text":"深入理解 dev 命令","link":"/zh/guide/advance/in-depth-about-dev-command"},{"text":"使用 Copy 工具","link":"/zh/guide/advance/copy"},{"text":"如何处理第三方依赖","link":"/zh/guide/advance/external-dependency"},{"text":"构建 umd 产物","link":"/zh/guide/advance/build-umd"},{"text":"处理静态文件","link":"/zh/guide/advance/asset"},{"text":"插件扩展","link":"/zh/guide/advance/extension"}]}],"/zh/api/":[{"text":"配置项","items":[{"text":"BuildConfig","link":"/zh/api/build-config"},{"text":"BuildPreset","link":"/zh/api/build-preset"},{"text":"Dev","link":"/zh/api/dev"},{"text":"Test","link":"/zh/api/test"},{"text":"Plugin","link":"/zh/api/plugin"},{"text":"DesignSystem","link":"/zh/api/design-system"}]}]},"title":"Module tools","outlineTitle":"目录","prevPageText":"上一页","nextPageText":"下一页","description":"模块工程解决方案","editLink":{"pattern":"https://github.com/modern-js-dev/modern.js/tree/next/website/module-tools/docs/:path","text":"📝 在 GitHub 上编辑此页"}},"/en/":{"lang":"en","label":"English","lastUpdated":"Last Updated","nav":[{"text":"Guide","link":"/en/guide/intro/welcome","activeMatch":"/guide/"},{"text":"API","link":"/en/api/","activeMatch":"/api/"},{"text":"v2.0.0-beta.4","items":[{"text":"Changelog","link":"https://github.com/modern-js-dev/modern.js"},{"text":"Contributing","link":"https://github.com/modern-js-dev/modern.js"}]}],"sidebar":{"/en/guide/":[{"text":"Introduction","items":[{"text":"WelCome","link":"/en/guide/intro/welcome"},{"text":"Why module project solution","link":"/en/guide/intro/why-module-engineering-solution"},{"text":"Getting Started","link":"/en/guide/intro/getting-started"}]},{"text":"Basic Guide","items":[{"text":"Before getting started","link":"/en/guide/basic/before-getting-started"},{"text":"Command preview","link":"/en/guide/basic/command-preview"},{"text":"Modify output product","link":"/en/guide/basic/modify-output-product"},{"text":"Use Micro generator","link":"/en/guide/basic/use-micro-generator"},{"text":"Using Storybook","link":"/en/guide/basic/using-storybook"},{"text":"Test project","link":"/en/guide/basic/test-your-project"},{"text":"Publish project","link":"/en/guide/basic/publish-your-project"}]},{"text":"Advanced Guide","items":[{"text":"In depth about build","link":"/en/guide/advance/in-depth-about-build"},{"text":"In depth about dev command","link":"/en/guide/advance/in-depth-about-dev-command"},{"text":"Use Copy Tools","link":"/en/guide/advance/copy"},{"text":"How to handle third-party dependencies","link":"/en/guide/advance/external-dependency"},{"text":"Build umd","link":"/en/guide/advance/build-umd"},{"text":"Handling static files","link":"/en/guide/advance/asset"},{"text":"Plugins extension","link":"/en/guide/advance/extension"}]}],"/en/api/":[{"text":"Config","items":[{"text":"BuildConfig","link":"/en/api/build-config"},{"text":"BuildPreset","link":"/en/api/build-preset"},{"text":"Dev","link":"/en/api/dev"},{"text":"Test","link":"/en/api/test"},{"text":"Plugin","link":"/en/api/plugin"},{"text":"DesignSystem","link":"/en/api/design-system"}]}]},"title":"Module tools","description":"Module Engineering Solutions","lastUpdatedText":"Last Updated","editLink":{"pattern":"https://github.com/modern-js-dev/modern.js/tree/next/website/module-tools/docs/:path","text":"📝 Edit this page on GitHub"}}},"outlineTitle":"ON THIS PAGE","socialLinks":[{"icon":"github","mode":"link","content":"https://github.com/modern-js-dev/modern.js"}],"footer":{"message":"The Module Engineering Solutions","copyright":"\nCopyright © 2022 ByteDance."}},"head":[["script",{"id":"check-dark-light"},"\n        ;(() => {\n          const saved = localStorage.getItem('island-theme-appearance')\n          const prefereDark = window.matchMedia('(prefers-color-scheme: dark)').matches\n          if (!saved || saved === 'auto' ? prefereDark : saved === 'dark') {\n            document.documentElement.classList.add('dark')\n          }\n        })()\n      "]],"base":"","icon":"","root":"/Users/targeral/github/targeral-modern-js/website/module-tools/docs","appearance":true},"pathname":"/zh/guide/advance/build-umd"},{"text":"v2.0.0-beta.4","items":[{"text":"更新日志","link":"https://github.com/modern-js-dev/modern.js"},{"text":"贡献指南","link":"https://github.com/modern-js-dev/modern.js"}]},{"items":[{"text":"简体中文","link":"/zh"},{"text":"English","link":"/en"}],"activeIndex":0,"isTranslation":true},{},{"socialLinks":[{"icon":"github","mode":"link","content":"https://github.com/modern-js-dev/modern.js"}]},{"pathname":"/zh/guide/advance/build-umd","langRoutePrefix":"","sidebarData":[{"text":"介绍","items":[{"text":"欢迎使用","link":"/zh/guide/intro/welcome"},{"text":"为什么需要模块工程解决方案","link":"/zh/guide/intro/why-module-engineering-solution"},{"text":"快速开始","link":"/zh/guide/intro/getting-started"}]},{"text":"基础使用","items":[{"text":"开始之前","link":"/zh/guide/basic/before-getting-started"},{"text":"命令预览","link":"/zh/guide/basic/command-preview"},{"text":"修改输出产物","link":"/zh/guide/basic/modify-output-product"},{"text":"使用微生成器","link":"/zh/guide/basic/use-micro-generator"},{"text":"使用 Storybook","link":"/zh/guide/basic/using-storybook"},{"text":"测试项目","link":"/zh/guide/basic/test-your-project"},{"text":"发布项目","link":"/zh/guide/basic/publish-your-project"}]},{"text":"进阶指南","items":[{"text":"深入理解构建","link":"/zh/guide/advance/in-depth-about-build"},{"text":"深入理解 dev 命令","link":"/zh/guide/advance/in-depth-about-dev-command"},{"text":"使用 Copy 工具","link":"/zh/guide/advance/copy"},{"text":"如何处理第三方依赖","link":"/zh/guide/advance/external-dependency"},{"text":"构建 umd 产物","link":"/zh/guide/advance/build-umd"},{"text":"处理静态文件","link":"/zh/guide/advance/asset"},{"text":"插件扩展","link":"/zh/guide/advance/extension"}]}]}]</script><script type="module" src="/assets/island_inject.69495876.js"></script>
+      <script type="module">import Le,{createContext as ke}from"react";import{jsx as Ce}from"react/jsx-runtime";const Ae="modulepreload",Ie=function(e){return"/"+e},ne={},Oe=function(t,n,i){return!n||n.length===0?t():Promise.all(n.map(r=>{if(r=Ie(r),r in ne)return;ne[r]=!0;const s=r.endsWith(".css"),p=s?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${r}"]${p}`))return;const a=document.createElement("link");if(a.rel=s?"stylesheet":Ae,s||(a.as="script",a.crossOrigin=""),a.href=r,document.head.appendChild(a),s)return new Promise((f,_)=>{a.addEventListener("load",f),a.addEventListener("error",()=>_(new Error(`Unable to preload CSS for ${r}`)))})})).then(()=>t())};const me=()=>typeof window<"u";ke({data:me()?window==null?void 0:window.ISLAND_PAGE_DATA:null,setData:e=>{}});const je="island-theme-appearance";let He,W,V;typeof window<"u"&&typeof localStorage<"u"&&(W=localStorage.getItem(je)||"auto",V=window.matchMedia("(prefers-color-scheme: dark)"),W==="auto"&&V.matches,V.onchange=e=>{W==="auto"&&Ne(e.matches)});const Ne=e=>{He[e?"add":"remove"]("dark")};var Re=typeof global=="object"&&global&&global.Object===Object&&global;const Pe=Re;var $e=typeof self=="object"&&self&&self.Object===Object&&self,De=Pe||$e||Function("return this")();const ue=De;var qe=ue.Symbol;const Y=qe;var pe=Object.prototype,Me=pe.hasOwnProperty,Be=pe.toString,D=Y?Y.toStringTag:void 0;function Ue(e){var t=Me.call(e,D),n=e[D];try{e[D]=void 0;var i=!0}catch{}var r=Be.call(e);return i&&(t?e[D]=n:delete e[D]),r}var We=Object.prototype,Ge=We.toString;function Fe(e){return Ge.call(e)}var Ye="[object Null]",Ke="[object Undefined]",oe=Y?Y.toStringTag:void 0;function Xe(e){return e==null?e===void 0?Ke:Ye:oe&&oe in Object(e)?Ue(e):Fe(e)}function Ze(e){return e!=null&&typeof e=="object"}var Ve="[object Symbol]";function Je(e){return typeof e=="symbol"||Ze(e)&&Xe(e)==Ve}var Qe=/\s/;function et(e){for(var t=e.length;t--&&Qe.test(e.charAt(t)););return t}var tt=/^\s+/;function nt(e){return e&&e.slice(0,et(e)+1).replace(tt,"")}function K(e){var t=typeof e;return e!=null&&(t=="object"||t=="function")}var re=0/0,ot=/^[-+]0x[0-9a-f]+$/i,rt=/^0b[01]+$/i,at=/^0o[0-7]+$/i,it=parseInt;function ae(e){if(typeof e=="number")return e;if(Je(e))return re;if(K(e)){var t=typeof e.valueOf=="function"?e.valueOf():e;e=K(t)?t+"":t}if(typeof e!="string")return e===0?e:+e;e=nt(e);var n=rt.test(e);return n||at.test(e)?it(e.slice(2),n?2:8):ot.test(e)?re:+e}var ct=function(){return ue.Date.now()};const J=ct;var st="Expected a function",dt=Math.max,lt=Math.min;function mt(e,t,n){var i,r,s,p,a,f,_=0,g=!1,w=!1,z=!0;if(typeof e!="function")throw new TypeError(st);t=ae(t)||0,K(n)&&(g=!!n.leading,w="maxWait"in n,s=w?dt(ae(n.maxWait)||0,t):s,z="trailing"in n?!!n.trailing:z);function L(h){var m=i,o=r;return i=r=void 0,_=h,p=e.apply(o,m),p}function E(h){return _=h,a=setTimeout(H,t),g?L(h):p}function A(h){var m=h-f,o=h-_,O=t-m;return w?lt(O,s-o):O}function M(h){var m=h-f,o=h-_;return f===void 0||m>=t||m<0||w&&o>=s}function H(){var h=J();if(M(h))return B(h);a=setTimeout(H,A(h))}function B(h){return a=void 0,z&&i?L(h):(i=r=void 0,p)}function x(){a!==void 0&&clearTimeout(a),_=0,i=f=r=a=void 0}function N(){return a===void 0?p:B(J())}function C(){var h=J(),m=M(h);if(i=arguments,r=this,f=h,m){if(a===void 0)return E(f);if(w)return clearTimeout(a),a=setTimeout(H,t),L(f)}return a===void 0&&(a=setTimeout(H,t)),p}return C.cancel=x,C.flush=N,C}var ut="Expected a function";function pt(e,t,n){var i=!0,r=!0;if(typeof e!="function")throw new TypeError(ut);return K(n)&&(i="leading"in n?!!n.leading:i,r="trailing"in n?!!n.trailing:r),mt(e,t,{leading:i,maxWait:t,trailing:r})}var ft=function(){var e=document.getSelection();if(!e.rangeCount)return function(){};for(var t=document.activeElement,n=[],i=0;i<e.rangeCount;i++)n.push(e.getRangeAt(i));switch(t.tagName.toUpperCase()){case"INPUT":case"TEXTAREA":t.blur();break;default:t=null;break}return e.removeAllRanges(),function(){e.type==="Caret"&&e.removeAllRanges(),e.rangeCount||n.forEach(function(r){e.addRange(r)}),t&&t.focus()}},gt=ft,ie={"text/plain":"Text","text/html":"Url",default:"Text"},vt="Copy to clipboard: #{key}, Enter";function ht(e){var t=(/mac os x/i.test(navigator.userAgent)?"\u2318":"Ctrl")+"+C";return e.replace(/#{\s*key\s*}/g,t)}function _t(e,t){var n,i,r,s,p,a,f=!1;t||(t={}),n=t.debug||!1;try{r=gt(),s=document.createRange(),p=document.getSelection(),a=document.createElement("span"),a.textContent=e,a.ariaHidden="true",a.style.all="unset",a.style.position="fixed",a.style.top=0,a.style.clip="rect(0, 0, 0, 0)",a.style.whiteSpace="pre",a.style.webkitUserSelect="text",a.style.MozUserSelect="text",a.style.msUserSelect="text",a.style.userSelect="text",a.addEventListener("copy",function(g){if(g.stopPropagation(),t.format)if(g.preventDefault(),typeof g.clipboardData>"u"){n&&console.warn("unable to use e.clipboardData"),n&&console.warn("trying IE specific stuff"),window.clipboardData.clearData();var w=ie[t.format]||ie.default;window.clipboardData.setData(w,e)}else g.clipboardData.clearData(),g.clipboardData.setData(t.format,e);t.onCopy&&(g.preventDefault(),t.onCopy(g.clipboardData))}),document.body.appendChild(a),s.selectNodeContents(a),p.addRange(s);var _=document.execCommand("copy");if(!_)throw new Error("copy command was unsuccessful");f=!0}catch(g){n&&console.error("unable to copy using execCommand: ",g),n&&console.warn("trying IE specific stuff");try{window.clipboardData.setData(t.format||"text",e),t.onCopy&&t.onCopy(window.clipboardData),f=!0}catch(w){n&&console.error("unable to copy using clipboardData: ",w),n&&console.error("falling back to prompt"),i=ht("message"in t?t.message:vt),window.prompt(i,e)}}finally{p&&(typeof p.removeRange=="function"?p.removeRange(s):p.removeAllRanges()),a&&document.body.removeChild(a),r()}return f}var yt=_t;function bt(){const e=new Map;window.addEventListener("click",t=>{var i;const n=t.target;if(n.matches('div[class*="language-"] > button.copy')){const r=n.parentElement,s=(i=n.nextElementSibling)==null?void 0:i.nextElementSibling;if(!r||!s)return;const{innerText:p=""}=s;if(yt(p)){n.classList.add("copied"),clearTimeout(e.get(n));const f=setTimeout(()=>{n.classList.remove("copied"),n.blur(),e.delete(n)},2e3);e.set(n,f)}}})}/*! medium-zoom 1.0.6 | MIT License | https://github.com/francoischalifour/medium-zoom */var j=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e},G=function(t){return t.tagName==="IMG"},wt=function(t){return NodeList.prototype.isPrototypeOf(t)},F=function(t){return t&&t.nodeType===1},ce=function(t){var n=t.currentSrc||t.src;return n.substr(-4).toLowerCase()===".svg"},se=function(t){try{return Array.isArray(t)?t.filter(G):wt(t)?[].slice.call(t).filter(G):F(t)?[t].filter(G):typeof t=="string"?[].slice.call(document.querySelectorAll(t)).filter(G):[]}catch{throw new TypeError(`The provided selector is invalid.
+Expects a CSS selector, a Node element, a NodeList or an array.
+See: https://github.com/francoischalifour/medium-zoom`)}},Et=function(t){var n=document.createElement("div");return n.classList.add("medium-zoom-overlay"),n.style.background=t,n},xt=function(t){var n=t.getBoundingClientRect(),i=n.top,r=n.left,s=n.width,p=n.height,a=t.cloneNode(),f=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,_=window.pageXOffset||document.documentElement.scrollLeft||document.body.scrollLeft||0;return a.removeAttribute("id"),a.style.position="absolute",a.style.top=i+f+"px",a.style.left=r+_+"px",a.style.width=s+"px",a.style.height=p+"px",a.style.transform="",a},P=function(t,n){var i=j({bubbles:!1,cancelable:!1,detail:void 0},n);if(typeof window.CustomEvent=="function")return new CustomEvent(t,i);var r=document.createEvent("CustomEvent");return r.initCustomEvent(t,i.bubbles,i.cancelable,i.detail),r},Tt=function e(t){var n=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},i=window.Promise||function(c){function d(){}c(d,d)},r=function(c){var d=c.target;if(d===O){E();return}x.indexOf(d)!==-1&&A({target:d})},s=function(){if(!(C||!o.original)){var c=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0;Math.abs(h-c)>m.scrollOffset&&setTimeout(E,150)}},p=function(c){var d=c.key||c.keyCode;(d==="Escape"||d==="Esc"||d===27)&&E()},a=function(){var c=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},d=c;if(c.background&&(O.style.background=c.background),c.container&&c.container instanceof Object&&(d.container=j({},m.container,c.container)),c.template){var v=F(c.template)?c.template:document.querySelector(c.template);d.template=v}return m=j({},m,d),x.forEach(function(y){y.dispatchEvent(P("medium-zoom:update",{detail:{zoom:b}}))}),b},f=function(){var c=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};return e(j({},m,c))},_=function(){for(var c=arguments.length,d=Array(c),v=0;v<c;v++)d[v]=arguments[v];var y=d.reduce(function(u,S){return[].concat(u,se(S))},[]);return y.filter(function(u){return x.indexOf(u)===-1}).forEach(function(u){x.push(u),u.classList.add("medium-zoom-image")}),N.forEach(function(u){var S=u.type,k=u.listener,R=u.options;y.forEach(function(I){I.addEventListener(S,k,R)})}),b},g=function(){for(var c=arguments.length,d=Array(c),v=0;v<c;v++)d[v]=arguments[v];o.zoomed&&E();var y=d.length>0?d.reduce(function(u,S){return[].concat(u,se(S))},[]):x;return y.forEach(function(u){u.classList.remove("medium-zoom-image"),u.dispatchEvent(P("medium-zoom:detach",{detail:{zoom:b}}))}),x=x.filter(function(u){return y.indexOf(u)===-1}),b},w=function(c,d){var v=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};return x.forEach(function(y){y.addEventListener("medium-zoom:"+c,d,v)}),N.push({type:"medium-zoom:"+c,listener:d,options:v}),b},z=function(c,d){var v=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};return x.forEach(function(y){y.removeEventListener("medium-zoom:"+c,d,v)}),N=N.filter(function(y){return!(y.type==="medium-zoom:"+c&&y.listener.toString()===d.toString())}),b},L=function(){var c=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},d=c.target,v=function(){var u={width:document.documentElement.clientWidth,height:document.documentElement.clientHeight,left:0,top:0,right:0,bottom:0},S=void 0,k=void 0;if(m.container)if(m.container instanceof Object)u=j({},u,m.container),S=u.width-u.left-u.right-m.margin*2,k=u.height-u.top-u.bottom-m.margin*2;else{var R=F(m.container)?m.container:document.querySelector(m.container),I=R.getBoundingClientRect(),X=I.width,ve=I.height,he=I.left,_e=I.top;u=j({},u,{width:X,height:ve,left:he,top:_e})}S=S||u.width-m.margin*2,k=k||u.height-m.margin*2;var $=o.zoomedHd||o.original,ye=ce($)?S:$.naturalWidth||S,be=ce($)?k:$.naturalHeight||k,U=$.getBoundingClientRect(),we=U.top,Ee=U.left,Q=U.width,ee=U.height,xe=Math.min(ye,S)/Q,Te=Math.min(be,k)/ee,Z=Math.min(xe,Te),Se=(-Ee+(S-Q)/2+m.margin+u.left)/Z,ze=(-we+(k-ee)/2+m.margin+u.top)/Z,te="scale("+Z+") translate3d("+Se+"px, "+ze+"px, 0)";o.zoomed.style.transform=te,o.zoomedHd&&(o.zoomedHd.style.transform=te)};return new i(function(y){if(d&&x.indexOf(d)===-1){y(b);return}var u=function X(){C=!1,o.zoomed.removeEventListener("transitionend",X),o.original.dispatchEvent(P("medium-zoom:opened",{detail:{zoom:b}})),y(b)};if(o.zoomed){y(b);return}if(d)o.original=d;else if(x.length>0){var S=x;o.original=S[0]}else{y(b);return}if(o.original.dispatchEvent(P("medium-zoom:open",{detail:{zoom:b}})),h=window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0,C=!0,o.zoomed=xt(o.original),document.body.appendChild(O),m.template){var k=F(m.template)?m.template:document.querySelector(m.template);o.template=document.createElement("div"),o.template.appendChild(k.content.cloneNode(!0)),document.body.appendChild(o.template)}if(document.body.appendChild(o.zoomed),window.requestAnimationFrame(function(){document.body.classList.add("medium-zoom--opened")}),o.original.classList.add("medium-zoom-image--hidden"),o.zoomed.classList.add("medium-zoom-image--opened"),o.zoomed.addEventListener("click",E),o.zoomed.addEventListener("transitionend",u),o.original.getAttribute("data-zoom-src")){o.zoomedHd=o.zoomed.cloneNode(),o.zoomedHd.removeAttribute("srcset"),o.zoomedHd.removeAttribute("sizes"),o.zoomedHd.src=o.zoomed.getAttribute("data-zoom-src"),o.zoomedHd.onerror=function(){clearInterval(R),console.warn("Unable to reach the zoom image target "+o.zoomedHd.src),o.zoomedHd=null,v()};var R=setInterval(function(){o.zoomedHd.complete&&(clearInterval(R),o.zoomedHd.classList.add("medium-zoom-image--opened"),o.zoomedHd.addEventListener("click",E),document.body.appendChild(o.zoomedHd),v())},10)}else if(o.original.hasAttribute("srcset")){o.zoomedHd=o.zoomed.cloneNode(),o.zoomedHd.removeAttribute("sizes"),o.zoomedHd.removeAttribute("loading");var I=o.zoomedHd.addEventListener("load",function(){o.zoomedHd.removeEventListener("load",I),o.zoomedHd.classList.add("medium-zoom-image--opened"),o.zoomedHd.addEventListener("click",E),document.body.appendChild(o.zoomedHd),v()})}else v()})},E=function(){return new i(function(c){if(C||!o.original){c(b);return}var d=function v(){o.original.classList.remove("medium-zoom-image--hidden"),document.body.removeChild(o.zoomed),o.zoomedHd&&document.body.removeChild(o.zoomedHd),document.body.removeChild(O),o.zoomed.classList.remove("medium-zoom-image--opened"),o.template&&document.body.removeChild(o.template),C=!1,o.zoomed.removeEventListener("transitionend",v),o.original.dispatchEvent(P("medium-zoom:closed",{detail:{zoom:b}})),o.original=null,o.zoomed=null,o.zoomedHd=null,o.template=null,c(b)};C=!0,document.body.classList.remove("medium-zoom--opened"),o.zoomed.style.transform="",o.zoomedHd&&(o.zoomedHd.style.transform=""),o.template&&(o.template.style.transition="opacity 150ms",o.template.style.opacity=0),o.original.dispatchEvent(P("medium-zoom:close",{detail:{zoom:b}})),o.zoomed.addEventListener("transitionend",d)})},A=function(){var c=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},d=c.target;return o.original?E():L({target:d})},M=function(){return m},H=function(){return x},B=function(){return o.original},x=[],N=[],C=!1,h=0,m=n,o={original:null,zoomed:null,zoomedHd:null,template:null};Object.prototype.toString.call(t)==="[object Object]"?m=t:(t||typeof t=="string")&&_(t),m=j({margin:0,background:"#fff",scrollOffset:40,container:null,template:null},m);var O=Et(m.background);document.addEventListener("click",r),document.addEventListener("keyup",p),document.addEventListener("scroll",s),window.addEventListener("resize",E);var b={open:L,close:E,toggle:A,update:a,clone:f,attach:_,detach:g,on:w,off:z,getOptions:M,getImages:H,getZoomedImage:B};return b};function St(e,t){t===void 0&&(t={});var n=t.insertAt;if(!(!e||typeof document>"u")){var i=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css",n==="top"&&i.firstChild?i.insertBefore(r,i.firstChild):i.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}var zt=".medium-zoom-overlay{position:fixed;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .3s;will-change:opacity}.medium-zoom--opened .medium-zoom-overlay{cursor:pointer;cursor:zoom-out;opacity:1}.medium-zoom-image{cursor:pointer;cursor:zoom-in;transition:transform .3s cubic-bezier(.2,0,.2,1)!important}.medium-zoom-image--hidden{visibility:hidden}.medium-zoom-image--opened{position:relative;cursor:pointer;cursor:zoom-out;will-change:transform}";St(zt);const Lt=Tt,kt=60;function Ct(){function e(t,n,i=!1){let r=null;try{r=t.classList.contains("header-anchor")?t:document.getElementById(decodeURIComponent(n.slice(1)))}catch(s){console.warn(s)}if(r){const s=parseInt(window.getComputedStyle(r).paddingTop,10),p=window.scrollY+r.getBoundingClientRect().top-kt+s;window.scrollTo({left:0,top:p,...i?{behavior:"smooth"}:{}})}}window.addEventListener("click",t=>{const n=t.target.closest("a");if(n){const{origin:i,hash:r,target:s,pathname:p,search:a}=n,f=window.location;r&&s!=="_blank"&&i===f.origin&&p===f.pathname&&a===f.search&&r&&r!==f.hash&&n.classList.contains("header-anchor")&&(t.preventDefault(),history.pushState(null,"",r),e(n,r,!0),window.dispatchEvent(new Event("hashchange")))}},{capture:!0}),window.addEventListener("hashchange",t=>{t.preventDefault()})}function At(){function e(){return document.documentElement.scrollTop+window.innerHeight>=document.documentElement.scrollHeight}const t=60,n=document.getElementById("aside-marker"),i=document.getElementById("aside-container"),r=document.querySelectorAll(".island-doc .header-anchor");let s=null;const p=Array.from((i==null?void 0:i.getElementsByTagName("a"))||[]).map(g=>decodeURIComponent(g.hash));if(n&&!p.length){n.style.opacity="0";return}const a=(g,w)=>{if(s&&s.classList.remove("aside-active"),g[w]){g[w].classList.add("aside-active");const z=g[w].getAttribute("href"),L=p.findIndex(A=>A===z),E=i==null?void 0:i.querySelector(`a[href="#${z==null?void 0:z.slice(1)}"]`);E&&(s=E,s.classList.add("aside-active"),n.style.top=`${33+L*28}px`,n.style.opacity="1")}},f=()=>{if(e())a(r,r.length-1);else for(let g=0;g<r.length;g++){const w=r[g],z=r[g+1],L=window.scrollY,E=w.parentElement.offsetTop-t;if(g===0&&L===0&&a(r,0),!z){a(r,g);break}const A=z.parentElement.offsetTop-t;if(L>E&&L<A){a(r,g);break}}},_=pt(f,100);return requestAnimationFrame(f),window.addEventListener("scroll",_),()=>{window.removeEventListener("scroll",_)}}function It(){const e=document.querySelectorAll("img");Lt(e,{margin:100,background:"rgba(0, 0, 0, 0.7)"})}function Ot(){!me()||(At(),Ct(),bt(),It())}if(typeof window<"u"){var de={get passive(){}};window.addEventListener("testPassive",null,de),window.removeEventListener("testPassive",null,de)}typeof window<"u"&&window.navigator&&window.navigator.platform&&(/iP(ad|hone|od)/.test(window.navigator.platform)||window.navigator.platform==="MacIntel"&&window.navigator.maxTouchPoints>1);var l={exports:{}},jt="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED",Ht=jt,Nt=Ht;function fe(){}function ge(){}ge.resetWarningCache=fe;var Rt=function(){function e(i,r,s,p,a,f){if(f!==Nt){var _=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw _.name="Invariant Violation",_}}e.isRequired=e;function t(){return e}var n={array:e,bigint:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:ge,resetWarningCache:fe};return n.PropTypes=n,n};l.exports=Rt();var q={BASE:"base",BODY:"body",HEAD:"head",HTML:"html",LINK:"link",META:"meta",NOSCRIPT:"noscript",SCRIPT:"script",STYLE:"style",TITLE:"title",FRAGMENT:"Symbol(react.fragment)"};Object.keys(q).map(function(e){return q[e]});var le={accesskey:"accessKey",charset:"charSet",class:"className",contenteditable:"contentEditable",contextmenu:"contextMenu","http-equiv":"httpEquiv",itemprop:"itemProp",tabindex:"tabIndex"};Object.keys(le).reduce(function(e,t){return e[le[t]]=t,e},{});q.NOSCRIPT,q.SCRIPT,q.STYLE;Le.createContext({});var Pt=l.exports.shape({setHelmet:l.exports.func,helmetInstances:l.exports.shape({get:l.exports.func,add:l.exports.func,remove:l.exports.func})});l.exports.shape({helmet:l.exports.shape()}),l.exports.node.isRequired;Pt.isRequired;l.exports.object,l.exports.object,l.exports.oneOfType([l.exports.arrayOf(l.exports.node),l.exports.node]),l.exports.string,l.exports.bool,l.exports.bool,l.exports.object,l.exports.arrayOf(l.exports.object),l.exports.arrayOf(l.exports.object),l.exports.arrayOf(l.exports.object),l.exports.func,l.exports.arrayOf(l.exports.object),l.exports.arrayOf(l.exports.object),l.exports.string,l.exports.object,l.exports.string,l.exports.bool,l.exports.object;async function $t(){if(!document.getElementById("root"))throw new Error("#root element not found");{const t=document.querySelectorAll("[__island]");if(t.length===0)return;const{hydrateRoot:n}=await Oe(()=>import("react-dom/client"),[]);for(let i=0;i<t.length;i++){const r=t[i],[s,p]=r.getAttribute("__island").split(":"),a=window.ISLANDS[s];n(r,Ce(a,{...window.ISLAND_PROPS[p]}))}}}$t().then(()=>{setTimeout(()=>{Ot()})});
+</script>
+    </body>
+  </html>