@modern-js/module-tools-docs 2.59.0 → 2.60.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4 -0
- package/doc_build/404.html +17 -0
- package/doc_build/api/config/build-config.html +1217 -0
- package/doc_build/api/config/build-preset.html +211 -0
- package/doc_build/api/config/dev.html +63 -0
- package/doc_build/api/config/plugins.html +54 -0
- package/doc_build/api/index.html +17 -0
- package/doc_build/api/plugin-api/plugin-hooks.html +395 -0
- package/doc_build/components/faq-build-exception.html +17 -0
- package/doc_build/components/faq-build-other.html +17 -0
- package/doc_build/components/faq-build-product.html +17 -0
- package/doc_build/components/faq-storybook.html +17 -0
- package/doc_build/components/publish-emo.html +17 -0
- package/doc_build/components/register-esbuild-plugin.html +27 -0
- package/doc_build/components/release-module-doc.html +17 -0
- package/doc_build/en/api/config/build-config.html +1220 -0
- package/doc_build/en/api/config/build-preset.html +206 -0
- package/doc_build/en/api/config/dev.html +63 -0
- package/doc_build/en/api/config/plugins.html +54 -0
- package/doc_build/en/api/index.html +17 -0
- package/doc_build/en/api/plugin-api/plugin-hooks.html +399 -0
- package/doc_build/en/components/faq-build-exception.html +17 -0
- package/doc_build/en/components/faq-build-other.html +17 -0
- package/doc_build/en/components/faq-build-product.html +17 -0
- package/doc_build/en/components/faq-storybook.html +17 -0
- package/doc_build/en/components/publish-emo.html +17 -0
- package/doc_build/en/components/register-esbuild-plugin.html +27 -0
- package/doc_build/en/components/release-module-doc.html +17 -0
- package/doc_build/en/guide/advance/asset.html +58 -0
- package/doc_build/en/guide/advance/build-umd.html +166 -0
- package/doc_build/en/guide/advance/copy.html +208 -0
- package/doc_build/en/guide/advance/external-dependency.html +62 -0
- package/doc_build/en/guide/advance/in-depth-about-build.html +302 -0
- package/doc_build/en/guide/advance/in-depth-about-dev-command.html +68 -0
- package/doc_build/en/guide/basic/before-getting-started.html +139 -0
- package/doc_build/en/guide/basic/command-preview.html +131 -0
- package/doc_build/en/guide/basic/modify-output-product.html +133 -0
- package/doc_build/en/guide/basic/publish-your-project.html +100 -0
- package/doc_build/en/guide/basic/use-micro-generator.html +54 -0
- package/doc_build/en/guide/basic/use-module-doc.html +397 -0
- package/doc_build/en/guide/basic/using-storybook.html +168 -0
- package/doc_build/en/guide/best-practices/components.html +198 -0
- package/doc_build/en/guide/best-practices/use-tailwindcss.html +243 -0
- package/doc_build/en/guide/faq/basic.html +23 -0
- package/doc_build/en/guide/faq/build.html +237 -0
- package/doc_build/en/guide/faq/index.html +23 -0
- package/doc_build/en/guide/faq/storybook.html +85 -0
- package/doc_build/en/guide/intro/getting-started.html +92 -0
- package/doc_build/en/guide/intro/welcome.html +27 -0
- package/doc_build/en/guide/intro/why-module-engineering-solution.html +25 -0
- package/doc_build/en/index.html +17 -0
- package/doc_build/en/plugins/guide/getting-started.html +70 -0
- package/doc_build/en/plugins/guide/plugin-object.html +74 -0
- package/doc_build/en/plugins/guide/setup-function.html +96 -0
- package/doc_build/en/plugins/official-list/overview.html +26 -0
- package/doc_build/en/plugins/official-list/plugin-babel.html +65 -0
- package/doc_build/en/plugins/official-list/plugin-banner.html +91 -0
- package/doc_build/en/plugins/official-list/plugin-import.html +111 -0
- package/doc_build/en/plugins/official-list/plugin-node-polyfill.html +128 -0
- package/doc_build/en/plugins/official-list/plugin-polyfill.html +72 -0
- package/doc_build/en/plugins/official-list/plugin-vue.html +66 -0
- package/doc_build/guide/advance/asset.html +55 -0
- package/doc_build/guide/advance/build-umd.html +170 -0
- package/doc_build/guide/advance/copy.html +208 -0
- package/doc_build/guide/advance/external-dependency.html +61 -0
- package/doc_build/guide/advance/in-depth-about-build.html +300 -0
- package/doc_build/guide/advance/in-depth-about-dev-command.html +68 -0
- package/doc_build/guide/basic/before-getting-started.html +139 -0
- package/doc_build/guide/basic/command-preview.html +131 -0
- package/doc_build/guide/basic/modify-output-product.html +134 -0
- package/doc_build/guide/basic/publish-your-project.html +99 -0
- package/doc_build/guide/basic/use-micro-generator.html +54 -0
- package/doc_build/guide/basic/use-module-doc.html +395 -0
- package/doc_build/guide/basic/using-storybook.html +177 -0
- package/doc_build/guide/best-practices/components.html +198 -0
- package/doc_build/guide/best-practices/use-tailwindcss.html +243 -0
- package/doc_build/guide/faq/basic.html +23 -0
- package/doc_build/guide/faq/build.html +234 -0
- package/doc_build/guide/faq/index.html +23 -0
- package/doc_build/guide/faq/storybook.html +85 -0
- package/doc_build/guide/intro/getting-started.html +89 -0
- package/doc_build/guide/intro/welcome.html +27 -0
- package/doc_build/guide/intro/why-module-engineering-solution.html +25 -0
- package/doc_build/index.html +17 -0
- package/doc_build/plugins/guide/getting-started.html +70 -0
- package/doc_build/plugins/guide/plugin-object.html +74 -0
- package/doc_build/plugins/guide/setup-function.html +95 -0
- package/doc_build/plugins/official-list/overview.html +26 -0
- package/doc_build/plugins/official-list/plugin-babel.html +64 -0
- package/doc_build/plugins/official-list/plugin-banner.html +94 -0
- package/doc_build/plugins/official-list/plugin-import.html +112 -0
- package/doc_build/plugins/official-list/plugin-node-polyfill.html +128 -0
- package/doc_build/plugins/official-list/plugin-polyfill.html +71 -0
- package/doc_build/plugins/official-list/plugin-vue.html +66 -0
- package/doc_build/static/css/styles.0b88df3a.css +1 -0
- package/doc_build/static/js/490.a066dbc0.js +6 -0
- package/doc_build/static/js/490.a066dbc0.js.LICENSE.txt +35 -0
- package/doc_build/static/js/async/1095.4ca5fdf0.js +1 -0
- package/doc_build/static/js/async/1148.ff6a84ca.js +1 -0
- package/doc_build/static/js/async/1306.8bc84d6b.js +1 -0
- package/doc_build/static/js/async/1507.fed31a58.js +1 -0
- package/doc_build/static/js/async/1527.4c6e53e2.js +1 -0
- package/doc_build/static/js/async/1657.d0d95d59.js +1 -0
- package/doc_build/static/js/async/1801.5d49a2fe.js +1 -0
- package/doc_build/static/js/async/1941.0b3cceee.js +1 -0
- package/doc_build/static/js/async/213.db8a0492.js +1 -0
- package/doc_build/static/js/async/2131.5dfdffa9.js +1 -0
- package/doc_build/static/js/async/2140.848412d7.js +1 -0
- package/doc_build/static/js/async/2206.f6b802b2.js +1 -0
- package/doc_build/static/js/async/2300.cba0106e.js +1 -0
- package/doc_build/static/js/async/2347.a480682f.js +1 -0
- package/doc_build/static/js/async/2365.daed0a9c.js +1 -0
- package/doc_build/static/js/async/2561.2e43400c.js +1 -0
- package/doc_build/static/js/async/2579.f7c71e6b.js +1 -0
- package/doc_build/static/js/async/2671.c711355f.js +1 -0
- package/doc_build/static/js/async/2704.561dadd9.js +1 -0
- package/doc_build/static/js/async/2712.5ffea5ba.js +1 -0
- package/doc_build/static/js/async/3023.5bef6325.js +1 -0
- package/doc_build/static/js/async/3039.3982622e.js +1 -0
- package/doc_build/static/js/async/3097.b043b3aa.js +1 -0
- package/doc_build/static/js/async/3213.df408a99.js +1 -0
- package/doc_build/static/js/async/3235.0c4d2c9b.js +1 -0
- package/doc_build/static/js/async/336.8387125c.js +1 -0
- package/doc_build/static/js/async/3493.5133deaa.js +1 -0
- package/doc_build/static/js/async/351.de7824af.js +1 -0
- package/doc_build/static/js/async/3597.cf46a69b.js +1 -0
- package/doc_build/static/js/async/36.eee0e8fe.js +1 -0
- package/doc_build/static/js/async/3628.726e3f10.js +1 -0
- package/doc_build/static/js/async/3724.bcc90bb4.js +1 -0
- package/doc_build/static/js/async/3761.949f5838.js +1 -0
- package/doc_build/static/js/async/4061.84ac839b.js +1 -0
- package/doc_build/static/js/async/4064.104b71cd.js +1 -0
- package/doc_build/static/js/async/4206.133ffe9e.js +1 -0
- package/doc_build/static/js/async/443.b519ce6b.js +1 -0
- package/doc_build/static/js/async/4501.c647ab73.js +1 -0
- package/doc_build/static/js/async/453.7358c1fd.js +1 -0
- package/doc_build/static/js/async/461.2d6ea16c.js +1 -0
- package/doc_build/static/js/async/4615.c4e5b749.js +1 -0
- package/doc_build/static/js/async/4655.bbe27e7b.js +1 -0
- package/doc_build/static/js/async/4812.ebd3f4cb.js +1 -0
- package/doc_build/static/js/async/4904.de72a299.js +1 -0
- package/doc_build/static/js/async/5105.28347c4d.js +1 -0
- package/doc_build/static/js/async/5453.87dcea50.js +1 -0
- package/doc_build/static/js/async/5455.9e038fda.js +1 -0
- package/doc_build/static/js/async/5493.3644c7b8.js +1 -0
- package/doc_build/static/js/async/5495.50aacc7e.js +1 -0
- package/doc_build/static/js/async/5555.40dabd12.js +1 -0
- package/doc_build/static/js/async/5558.073d18d0.js +1 -0
- package/doc_build/static/js/async/5844.b3a9d57a.js +1 -0
- package/doc_build/static/js/async/588.6de9811a.js +1 -0
- package/doc_build/static/js/async/5889.41a786b6.js +1 -0
- package/doc_build/static/js/async/5892.b0db6657.js +1 -0
- package/doc_build/static/js/async/5995.209e2925.js +1 -0
- package/doc_build/static/js/async/6046.963bbf59.js +1 -0
- package/doc_build/static/js/async/6308.6363792d.js +1 -0
- package/doc_build/static/js/async/6576.a753babb.js +1 -0
- package/doc_build/static/js/async/6615.154a2810.js +1 -0
- package/doc_build/static/js/async/6858.e2452605.js +1 -0
- package/doc_build/static/js/async/6975.be4ba201.js +1 -0
- package/doc_build/static/js/async/7080.1c684c7d.js +1 -0
- package/doc_build/static/js/async/7220.1c4ee8bb.js +1 -0
- package/doc_build/static/js/async/7406.b2acec42.js +1 -0
- package/doc_build/static/js/async/7521.ca744786.js +1 -0
- package/doc_build/static/js/async/7535.f50f0fd1.js +1 -0
- package/doc_build/static/js/async/7584.c3b673fd.js +1 -0
- package/doc_build/static/js/async/7600.03d9da89.js +1 -0
- package/doc_build/static/js/async/7663.86b79735.js +1 -0
- package/doc_build/static/js/async/769.2bc1c7b7.js +1 -0
- package/doc_build/static/js/async/7715.1bfe887f.js +1 -0
- package/doc_build/static/js/async/7837.5667c422.js +1 -0
- package/doc_build/static/js/async/8040.1cfb21ff.js +1 -0
- package/doc_build/static/js/async/8085.f9f71860.js +1 -0
- package/doc_build/static/js/async/8098.beeb77f3.js +1 -0
- package/doc_build/static/js/async/8134.068074a0.js +1 -0
- package/doc_build/static/js/async/8158.2834ced1.js +1 -0
- package/doc_build/static/js/async/8214.2fdfe2fe.js +1 -0
- package/doc_build/static/js/async/8233.24111213.js +1 -0
- package/doc_build/static/js/async/8451.5328c0c7.js +1 -0
- package/doc_build/static/js/async/8689.f8447ca1.js +1 -0
- package/doc_build/static/js/async/8694.077556c4.js +1 -0
- package/doc_build/static/js/async/8713.91395601.js +1 -0
- package/doc_build/static/js/async/8750.0f6872b3.js +1 -0
- package/doc_build/static/js/async/8802.463e3040.js +1 -0
- package/doc_build/static/js/async/9100.066e1017.js +1 -0
- package/doc_build/static/js/async/9250.8fb41a47.js +1 -0
- package/doc_build/static/js/async/9524.bb257861.js +1 -0
- package/doc_build/static/js/async/9611.b2543acb.js +1 -0
- package/doc_build/static/js/async/964.b00f3e9f.js +1 -0
- package/doc_build/static/js/async/9740.b27e6629.js +1 -0
- package/doc_build/static/js/index.6a5d779d.js +1 -0
- package/doc_build/static/js/lib-react.a93218f7.js +2 -0
- package/doc_build/static/js/lib-react.a93218f7.js.LICENSE.txt +39 -0
- package/doc_build/static/js/lib-router.f8d11890.js +2 -0
- package/doc_build/static/js/lib-router.f8d11890.js.LICENSE.txt +32 -0
- package/doc_build/static/js/styles.3f5a6140.js +1 -0
- package/doc_build/static/search_index.en.f19ea64b.json +1 -0
- package/doc_build/static/search_index.zh.e818eee4.json +1 -0
- package/doc_build/test-result.png +0 -0
- package/doc_build/why-module-solution.png +0 -0
- package/docs/en/api/config/dev.md +2 -2
- package/docs/en/guide/basic/command-preview.md +0 -16
- package/docs/en/guide/intro/welcome.md +0 -1
- package/docs/zh/api/config/dev.md +2 -2
- package/docs/zh/guide/basic/command-preview.md +0 -16
- package/docs/zh/guide/basic/using-storybook.mdx +1 -1
- package/docs/zh/guide/intro/welcome.md +0 -1
- package/package.json +4 -4
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="zh">
|
|
3
|
+
|
|
4
|
+
<head>
|
|
5
|
+
<meta charset="UTF-8">
|
|
6
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
7
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
8
|
+
<meta name="generator" content="Rspress v1.31.0">
|
|
9
|
+
<title data-rh="true">常见问题 - Modern.js Module</title><meta data-rh="true" name="description" content="模块工程解决方案"/>
|
|
10
|
+
<script>{;const saved = localStorage.getItem('rspress-theme-appearance');const preferDark = window.matchMedia('(prefers-color-scheme: dark)').matches;const isDark = !saved || saved === 'auto' ? preferDark : saved === 'dark';document.documentElement.classList.toggle('dark', isDark);document.documentElement.style.colorScheme = isDark ? 'dark' : 'light';}</script><link rel="icon" href="https://lf3-static.bytednsdoc.com/obj/eden-cn/zq-uylkvT/ljhwZthlaukjlkulzlp/logo-1x-0104.png"><script defer src="/module-tools/static/js/styles.3f5a6140.js"></script><script defer src="/module-tools/static/js/lib-react.a93218f7.js"></script><script defer src="/module-tools/static/js/lib-router.f8d11890.js"></script><script defer src="/module-tools/static/js/490.a066dbc0.js"></script><script defer src="/module-tools/static/js/index.6a5d779d.js"></script><link href="/module-tools/static/css/styles.0b88df3a.css" rel="stylesheet"></head>
|
|
11
|
+
|
|
12
|
+
<body >
|
|
13
|
+
<div id="root"><div><div class="navContainer_f6cde rspress-nav px-6 " style="position:sticky"><div class="container_f6cde flex justify-between items-center h-full"><div class="navBarTitle_f6cde"><a href="/module-tools/" class="flex items-center w-full h-full text-base font-semibold transition-opacity duration-300 hover:opacity-60"><span>Modern.js Module</span></a></div><div class="flex flex-1 justify-end items-center"><div class="rightNav_f6cde"><div class="flex sm:flex-1 items-center sm:pl-4 sm:pr-2"><div class="rspress-nav-search-button navSearchButton_6e282"><button><svg width="18" height="18" viewBox="0 0 32 32"><path fill="var(--rp-c-gray)" d="m29 27.586-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9 9.01 9.01 0 0 1-9-9Z"></path></svg><p class="searchWord_6e282">Search Docs</p><div style="opacity:0"><span></span><span>K</span></div></button></div><div class="mobileNavSearchButton_6e282"><svg width="24" height="24" viewBox="0 0 32 32"><path fill="var(--rp-c-gray)" d="m29 27.586-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9 9.01 9.01 0 0 1-9-9Z"></path></svg></div></div><div class="rspress-nav-menu menu h-14"><a class="link_03735 cursor-pointer" target="" href="/module-tools/guide/intro/welcome.html"><div class="rspress-nav-menu-item singleItem_f6cde activeItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">指南</div></a><a class="link_03735 cursor-pointer" target="" href="/module-tools/api/index.html"><div class="rspress-nav-menu-item singleItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">API</div></a><a class="link_03735 cursor-pointer" target="" href="/module-tools/plugins/guide/getting-started.html"><div class="rspress-nav-menu-item singleItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">插件</div></a><div class="mx-3 last:mr-0"><div class="relative flex-center h-14"><button class="rspress-nav-menu-group-button flex-center items-center font-medium text-sm text-text-1 hover:text-text-2 transition-colors duration-200"><span class="text-sm font-medium flex" style="margin-right:2px">v2.60.1</span><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div class="rspress-nav-menu-group-content absolute mx-0.8 transition-opacity duration-300" style="opacity:0;visibility:hidden;right:0;top:52px"><div class="p-3 pr-2 w-full h-full max-h-100vh whitespace-nowrap" style="box-shadow:var(--rp-shadow-3);z-index:100;border:1px solid var(--rp-c-divider-light);border-radius:var(--rp-radius-large);background:var(--rp-c-bg)"><div><div class="font-medium my-1"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/module-tools/CHANGELOG.md" target="_blank" rel="noopener noreferrer" class="link_03735 "><div class="rounded-2xl hover:bg-mute" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><div class="flex"><span>更新日志</span></div></div></a></div></div><div><div class="font-medium my-1"><a href="https://modernjs.dev/en/community/contributing-guide.html" target="_blank" rel="noopener noreferrer" class="link_03735 "><div class="rounded-2xl hover:bg-mute" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><div class="flex"><span>贡献指南</span></div></div></a></div></div></div></div></div></div></div><div class="flex-center flex-row"><div class="translation menu-item_f6cde flex text-sm font-bold items-center px-3 py-2"><div><div class="relative flex-center h-14"><button class="rspress-nav-menu-group-button flex-center items-center font-medium text-sm text-text-1 hover:text-text-2 transition-colors duration-200"><span class="text-sm font-medium flex" style="margin-right:2px"><svg width="18" height="18" viewBox="0 0 32 32" style="width:18px;height:18px"><path fill="currentColor" d="M27.85 29H30l-6-15h-2.35l-6 15h2.15l1.6-4h6.85zm-7.65-6 2.62-6.56L25.45 23zM18 7V5h-7V2H9v3H2v2h10.74a14.71 14.71 0 0 1-3.19 6.18A13.5 13.5 0 0 1 7.26 9h-2.1a16.47 16.47 0 0 0 3 5.58A16.84 16.84 0 0 1 3 18l.75 1.86A18.47 18.47 0 0 0 9.53 16a16.92 16.92 0 0 0 5.76 3.84L16 18a14.48 14.48 0 0 1-5.12-3.37A17.64 17.64 0 0 0 14.8 7z"></path></svg></span><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div class="rspress-nav-menu-group-content absolute mx-0.8 transition-opacity duration-300" style="opacity:0;visibility:hidden;right:0;top:52px"><div class="p-3 pr-2 w-full h-full max-h-100vh whitespace-nowrap" style="box-shadow:var(--rp-shadow-3);z-index:100;border:1px solid var(--rp-c-divider-light);border-radius:var(--rp-radius-large);background:var(--rp-c-bg)"><div><div class="rounded-2xl my-1 flex" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><span class="text-brand">简体中文</span></div></div><div><div class="font-medium my-1"><a class="link_03735 cursor-pointer" target="" href="/module-tools/en/guide/faq/index.html"><div class="rounded-2xl hover:bg-mute" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><div class="flex"><span>English</span></div></div></a></div></div></div></div></div></div></div><div class="mx-2"><div class="md:mr-2 rspress-nav-appearance"><div class="p-1 border border-solid border-gray-300 text-gray-400 cursor-pointer rounded-md hover:border-gray-600 hover:text-gray-600 dark:hover:border-gray-200 dark:hover:text-gray-200 transition-all duration-300 w-7 h-7"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" viewBox="0 0 24 24" class="dark:hidden" width="18" height="18" fill="currentColor"><path d="M12 18c-3.3 0-6-2.7-6-6s2.7-6 6-6 6 2.7 6 6-2.7 6-6 6zm0-10c-2.2 0-4 1.8-4 4s1.8 4 4 4 4-1.8 4-4-1.8-4-4-4zM12 4c-.6 0-1-.4-1-1V1c0-.6.4-1 1-1s1 .4 1 1v2c0 .6-.4 1-1 1zM12 24c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1s1 .4 1 1v2c0 .6-.4 1-1 1zM5.6 6.6c-.3 0-.5-.1-.7-.3L3.5 4.9c-.4-.4-.4-1 0-1.4s1-.4 1.4 0l1.4 1.4c.4.4.4 1 0 1.4-.1.2-.4.3-.7.3zM19.8 20.8c-.3 0-.5-.1-.7-.3l-1.4-1.4c-.4-.4-.4-1 0-1.4s1-.4 1.4 0l1.4 1.4c.4.4.4 1 0 1.4-.2.2-.5.3-.7.3zM3 13H1c-.6 0-1-.4-1-1s.4-1 1-1h2c.6 0 1 .4 1 1s-.4 1-1 1zM23 13h-2c-.6 0-1-.4-1-1s.4-1 1-1h2c.6 0 1 .4 1 1s-.4 1-1 1zM4.2 20.8c-.3 0-.5-.1-.7-.3-.4-.4-.4-1 0-1.4l1.4-1.4c.4-.4 1-.4 1.4 0s.4 1 0 1.4l-1.4 1.4c-.2.2-.4.3-.7.3zM18.4 6.6c-.3 0-.5-.1-.7-.3-.4-.4-.4-1 0-1.4l1.4-1.4c.4-.4 1-.4 1.4 0s.4 1 0 1.4l-1.4 1.4c-.2.2-.5.3-.7.3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" viewBox="0 0 24 24" class="hidden dark:block" width="18" height="18" fill="currentColor"><path d="M12.1 22h-.9c-5.5-.5-9.5-5.4-9-10.9.4-4.8 4.2-8.6 9-9 .4 0 .8.2 1 .5.2.3.2.8-.1 1.1-2 2.7-1.4 6.4 1.3 8.4 2.1 1.6 5 1.6 7.1 0 .3-.2.7-.3 1.1-.1.3.2.5.6.5 1-.2 2.7-1.5 5.1-3.6 6.8-1.9 1.4-4.1 2.2-6.4 2.2zM9.3 4.4c-2.9 1-5 3.6-5.2 6.8-.4 4.4 2.8 8.3 7.2 8.7 2.1.2 4.2-.4 5.8-1.8 1.1-.9 1.9-2.1 2.4-3.4-2.5.9-5.3.5-7.5-1.1-2.8-2.2-3.9-5.9-2.7-9.2z"></path></svg></div></div></div><div class="social-links menu-item_93d67 flex-center relative"><div class="flex-center h-full gap-x-4 transition-colors duration-300 md:mr-2"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/module-tools" target="_blank" rel="noopener noreferrer" class="social-links"><div class="social-links-icon_93d67"><svg role="img" viewBox="0 0 24 24" width="24" height="24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></div></a></div></div></div></div><div class="mobileNavMenu_f6cde"><div class="navScreen_457e8 " id="navScreen"><div class="container_457e8"><div class="navMenu_457e8"><div class="navMenuItem_457e8 w-full"><a class="link_03735 cursor-pointer" target="" href="/module-tools/guide/intro/welcome.html"><div class="rspress-nav-menu-item singleItem_f6cde activeItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">指南</div></a></div><div class="navMenuItem_457e8 w-full"><a class="link_03735 cursor-pointer" target="" href="/module-tools/api/index.html"><div class="rspress-nav-menu-item singleItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">API</div></a></div><div class="navMenuItem_457e8 w-full"><a class="link_03735 cursor-pointer" target="" href="/module-tools/plugins/guide/getting-started.html"><div class="rspress-nav-menu-item singleItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">插件</div></a></div><div class="navMenuItem_457e8 w-full"><div class="mx-3 last:mr-0"><div class=" navScreenMenuGroup_457e8 relative"><button class="button_457e8"><span class="buttonSpan_457e8">v2.60.1</span><svg width="1em" height="1em" viewBox="0 0 32 32" class=" down_457e8 "><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div><div class="items_457e8"><div><div class="py-1 font-medium"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/module-tools/CHANGELOG.md" target="_blank" rel="noopener noreferrer" class="link_03735 "><div><div class="flex justify-center"><span>更新日志</span></div></div></a></div></div><div><div class="py-1 font-medium"><a href="https://modernjs.dev/en/community/contributing-guide.html" target="_blank" rel="noopener noreferrer" class="link_03735 "><div><div class="flex justify-center"><span>贡献指南</span></div></div></a></div></div></div></div></div></div></div></div><div class="flex-center flex-col gap-2"><div class="mt-2 navAppearance_457e8 flex justify-center"></div><div class="flex text-sm font-bold justify-center"><div class="mx-1.5 my-1"><div class=" navScreenMenuGroup_457e8 relative"><button class="button_457e8"><span class="buttonSpan_457e8"><svg width="18" height="18" viewBox="0 0 32 32" style="width:18px;height:18px"><path fill="currentColor" d="M27.85 29H30l-6-15h-2.35l-6 15h2.15l1.6-4h6.85zm-7.65-6 2.62-6.56L25.45 23zM18 7V5h-7V2H9v3H2v2h10.74a14.71 14.71 0 0 1-3.19 6.18A13.5 13.5 0 0 1 7.26 9h-2.1a16.47 16.47 0 0 0 3 5.58A16.84 16.84 0 0 1 3 18l.75 1.86A18.47 18.47 0 0 0 9.53 16a16.92 16.92 0 0 0 5.76 3.84L16 18a14.48 14.48 0 0 1-5.12-3.37A17.64 17.64 0 0 0 14.8 7z"></path></svg></span><svg width="1em" height="1em" viewBox="0 0 32 32" class=" down_457e8 "><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div><div class="items_457e8"><div><div class="p-1 text-center"><span class="text-brand">简体中文</span></div></div><div><div class="py-1 font-medium"><a class="link_03735 cursor-pointer" target="" href="/module-tools/en/guide/faq/index.html"><div><div class="flex justify-center"><span>English</span></div></div></a></div></div></div></div></div></div></div><div class="social-links menu-item_93d67 flex-center relative"><div class="flex-center h-full gap-x-4 transition-colors duration-300 md:mr-2"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/module-tools" target="_blank" rel="noopener noreferrer" class="social-links"><div class="social-links-icon_93d67"><svg role="img" viewBox="0 0 24 24" width="24" height="24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></div></a></div></div></div></div></div><button aria-label="mobile hamburger" class=" navHamburger_e7b06 text-gray-500"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="currentColor"><circle cx="8" cy="16" r="2" fill="currentColor"></circle><circle cx="16" cy="16" r="2" fill="currentColor"></circle><circle cx="24" cy="16" r="2" fill="currentColor"></circle></svg></button></div></div></div></div><section><div class="docLayout_edeb4 pt-0"><div class="rspress-sidebar-menu"><button class="flex-center mr-auto"><div class="text-md mr-2"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M4 6h24v2H4zm0 18h24v2H4zm0-12h24v2H4zm0 6h24v2H4z"></path></svg></div><span class="text-sm">Menu</span></button><button class="flex-center ml-auto"><span class="text-sm">目录</span><div class="text-md mr-2" style="transform:rotate(0deg);transition:transform 0.2s ease-out;margin-top:2px"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></button></div><aside class="sidebar_71eca rspress-sidebar "><div class="navTitleMask_71eca"><div class="navBarTitle_f6cde"><a href="/module-tools/" class="flex items-center w-full h-full text-base font-semibold transition-opacity duration-300 hover:opacity-60"><span>Modern.js Module</span></a></div></div><div class="rspress-scrollbar sidebarContent_71eca"><nav class="pb-2"><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center" style="font-size:14px">介绍</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/intro/welcome.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>欢迎使用</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/intro/why-module-engineering-solution.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>为什么需要 Modern.js Module</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/intro/getting-started.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>快速开始</span></div></a></div></div></div></section><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center" style="font-size:14px">基础使用</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/before-getting-started.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>开始之前</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/command-preview.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>CLI 命令</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/modify-output-product.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>修改输出产物</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/use-micro-generator.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>使用微生成器</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/use-module-doc.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>开发模块文档</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/using-storybook.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>使用 Storybook</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/publish-your-project.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>版本管理与发布</span></div></a></div></div></div></section><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center" style="font-size:14px">进阶指南</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/advance/in-depth-about-build.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>深入理解构建</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/advance/in-depth-about-dev-command.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>深入理解 dev 命令</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/advance/copy.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>使用 Copy 工具</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/advance/external-dependency.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>处理三方依赖</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/advance/build-umd.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>构建 umd 产物</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/advance/asset.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>处理静态资源</span></div></a></div></div></div></section><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center" style="font-size:14px">最佳实践</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/best-practices/components.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>开发组件</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/best-practices/use-tailwindcss.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>使用 Tailwind CSS</span></div></a></div></div></div></section><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItemActive_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center" style="font-size:14px">常见问题</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/faq/basic.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>通用类问题</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/faq/build.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>构建相关问题</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/faq/storybook.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Storybook 相关问题</span></div></a></div></div></div></section></nav></div></aside><div class="content_edeb4 rspress-doc-container flex flex-shrink-0 mx-auto"><div class="w-full flex-1"><div><div class="rspress-doc"><!--$--><h1 id="常见问题" class="text-3xl mb-10 leading-10 tracking-tight title_3b154">常见问题<a class="link_3b154 header-anchor" aria-hidden="true" href="#常见问题">#</a></h1>
|
|
14
|
+
<p class="my-4 leading-7">这里是 Modern.js Module 常见问题分类列表:</p>
|
|
15
|
+
<ul class="list-disc pl-5 my-4 leading-7">
|
|
16
|
+
<li class="[&:not(:first-child)]:mt-2"><a class="link_03735 link_3b154 inline-link_3b154 cursor-pointer" target="" href="/module-tools/guide/faq/basic.html">通用类问题</a></li>
|
|
17
|
+
<li class="[&:not(:first-child)]:mt-2"><a class="link_03735 link_3b154 inline-link_3b154 cursor-pointer" target="" href="/module-tools/guide/faq/build.html">构建相关问题</a></li>
|
|
18
|
+
<li class="[&:not(:first-child)]:mt-2"><a class="link_03735 link_3b154 inline-link_3b154 cursor-pointer" target="" href="/module-tools/guide/faq/storybook.html">Storybook 相关问题</a></li>
|
|
19
|
+
</ul><!--/$--></div><div class="rspress-doc-footer"><footer class="mt-8"><div class="xs:flex pb-5 px-2 justify-end items-center"></div><div class="flex flex-col"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/document/module-doc/docs/zh/guide/faq/index.md" target="_blank" class="editLink_2a169">Edit this page on GitHub</a></div><div class="flex flex-col sm:flex-row sm:justify-around gap-4 pt-6"><div class="prev_e7091 flex flex-col"><a class="link_03735 pager-link_9b9a7 cursor-pointer" target="" href="/module-tools/guide/best-practices/use-tailwindcss.html"><span class="desc_9b9a7">上一页</span><span class="title_9b9a7">使用 Tailwind CSS</span></a></div><div class="next_e7091 flex flex-col"><a class="link_03735 pager-link_9b9a7 next_9b9a7 cursor-pointer" target="" href="/module-tools/guide/faq/basic.html"><span class="desc_9b9a7">下一页</span><span class="title_9b9a7">通用类问题</span></a></div></div></footer></div></div></div><div class="aside-container_edeb4"><div><div class="flex flex-col"><div class="hidden"><div id="aside-container" class="relative text-sm font-medium"><div class="leading-7 block text-sm font-semibold pl-3">目录</div><nav class="mt-1"><ul class="relative"></ul></nav></div></div></div></div></div></div></div></section></div></div>
|
|
20
|
+
<div id="search-container"></div>
|
|
21
|
+
</body>
|
|
22
|
+
|
|
23
|
+
</html>
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="zh">
|
|
3
|
+
|
|
4
|
+
<head>
|
|
5
|
+
<meta charset="UTF-8">
|
|
6
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
7
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
8
|
+
<meta name="generator" content="Rspress v1.31.0">
|
|
9
|
+
<title data-rh="true">Storybook 相关问题 - Modern.js Module</title><meta data-rh="true" name="description" content="模块工程解决方案"/>
|
|
10
|
+
<script>{;const saved = localStorage.getItem('rspress-theme-appearance');const preferDark = window.matchMedia('(prefers-color-scheme: dark)').matches;const isDark = !saved || saved === 'auto' ? preferDark : saved === 'dark';document.documentElement.classList.toggle('dark', isDark);document.documentElement.style.colorScheme = isDark ? 'dark' : 'light';}</script><link rel="icon" href="https://lf3-static.bytednsdoc.com/obj/eden-cn/zq-uylkvT/ljhwZthlaukjlkulzlp/logo-1x-0104.png"><script defer src="/module-tools/static/js/styles.3f5a6140.js"></script><script defer src="/module-tools/static/js/lib-react.a93218f7.js"></script><script defer src="/module-tools/static/js/lib-router.f8d11890.js"></script><script defer src="/module-tools/static/js/490.a066dbc0.js"></script><script defer src="/module-tools/static/js/index.6a5d779d.js"></script><link href="/module-tools/static/css/styles.0b88df3a.css" rel="stylesheet"></head>
|
|
11
|
+
|
|
12
|
+
<body >
|
|
13
|
+
<div id="root"><div><div class="navContainer_f6cde rspress-nav px-6 " style="position:sticky"><div class="container_f6cde flex justify-between items-center h-full"><div class="navBarTitle_f6cde"><a href="/module-tools/" class="flex items-center w-full h-full text-base font-semibold transition-opacity duration-300 hover:opacity-60"><span>Modern.js Module</span></a></div><div class="flex flex-1 justify-end items-center"><div class="rightNav_f6cde"><div class="flex sm:flex-1 items-center sm:pl-4 sm:pr-2"><div class="rspress-nav-search-button navSearchButton_6e282"><button><svg width="18" height="18" viewBox="0 0 32 32"><path fill="var(--rp-c-gray)" d="m29 27.586-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9 9.01 9.01 0 0 1-9-9Z"></path></svg><p class="searchWord_6e282">Search Docs</p><div style="opacity:0"><span></span><span>K</span></div></button></div><div class="mobileNavSearchButton_6e282"><svg width="24" height="24" viewBox="0 0 32 32"><path fill="var(--rp-c-gray)" d="m29 27.586-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9 9.01 9.01 0 0 1-9-9Z"></path></svg></div></div><div class="rspress-nav-menu menu h-14"><a class="link_03735 cursor-pointer" target="" href="/module-tools/guide/intro/welcome.html"><div class="rspress-nav-menu-item singleItem_f6cde activeItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">指南</div></a><a class="link_03735 cursor-pointer" target="" href="/module-tools/api/index.html"><div class="rspress-nav-menu-item singleItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">API</div></a><a class="link_03735 cursor-pointer" target="" href="/module-tools/plugins/guide/getting-started.html"><div class="rspress-nav-menu-item singleItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">插件</div></a><div class="mx-3 last:mr-0"><div class="relative flex-center h-14"><button class="rspress-nav-menu-group-button flex-center items-center font-medium text-sm text-text-1 hover:text-text-2 transition-colors duration-200"><span class="text-sm font-medium flex" style="margin-right:2px">v2.60.1</span><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div class="rspress-nav-menu-group-content absolute mx-0.8 transition-opacity duration-300" style="opacity:0;visibility:hidden;right:0;top:52px"><div class="p-3 pr-2 w-full h-full max-h-100vh whitespace-nowrap" style="box-shadow:var(--rp-shadow-3);z-index:100;border:1px solid var(--rp-c-divider-light);border-radius:var(--rp-radius-large);background:var(--rp-c-bg)"><div><div class="font-medium my-1"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/module-tools/CHANGELOG.md" target="_blank" rel="noopener noreferrer" class="link_03735 "><div class="rounded-2xl hover:bg-mute" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><div class="flex"><span>更新日志</span></div></div></a></div></div><div><div class="font-medium my-1"><a href="https://modernjs.dev/en/community/contributing-guide.html" target="_blank" rel="noopener noreferrer" class="link_03735 "><div class="rounded-2xl hover:bg-mute" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><div class="flex"><span>贡献指南</span></div></div></a></div></div></div></div></div></div></div><div class="flex-center flex-row"><div class="translation menu-item_f6cde flex text-sm font-bold items-center px-3 py-2"><div><div class="relative flex-center h-14"><button class="rspress-nav-menu-group-button flex-center items-center font-medium text-sm text-text-1 hover:text-text-2 transition-colors duration-200"><span class="text-sm font-medium flex" style="margin-right:2px"><svg width="18" height="18" viewBox="0 0 32 32" style="width:18px;height:18px"><path fill="currentColor" d="M27.85 29H30l-6-15h-2.35l-6 15h2.15l1.6-4h6.85zm-7.65-6 2.62-6.56L25.45 23zM18 7V5h-7V2H9v3H2v2h10.74a14.71 14.71 0 0 1-3.19 6.18A13.5 13.5 0 0 1 7.26 9h-2.1a16.47 16.47 0 0 0 3 5.58A16.84 16.84 0 0 1 3 18l.75 1.86A18.47 18.47 0 0 0 9.53 16a16.92 16.92 0 0 0 5.76 3.84L16 18a14.48 14.48 0 0 1-5.12-3.37A17.64 17.64 0 0 0 14.8 7z"></path></svg></span><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div class="rspress-nav-menu-group-content absolute mx-0.8 transition-opacity duration-300" style="opacity:0;visibility:hidden;right:0;top:52px"><div class="p-3 pr-2 w-full h-full max-h-100vh whitespace-nowrap" style="box-shadow:var(--rp-shadow-3);z-index:100;border:1px solid var(--rp-c-divider-light);border-radius:var(--rp-radius-large);background:var(--rp-c-bg)"><div><div class="rounded-2xl my-1 flex" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><span class="text-brand">简体中文</span></div></div><div><div class="font-medium my-1"><a class="link_03735 cursor-pointer" target="" href="/module-tools/en/guide/faq/storybook.html"><div class="rounded-2xl hover:bg-mute" style="padding:0.4rem 1.5rem 0.4rem 0.75rem"><div class="flex"><span>English</span></div></div></a></div></div></div></div></div></div></div><div class="mx-2"><div class="md:mr-2 rspress-nav-appearance"><div class="p-1 border border-solid border-gray-300 text-gray-400 cursor-pointer rounded-md hover:border-gray-600 hover:text-gray-600 dark:hover:border-gray-200 dark:hover:text-gray-200 transition-all duration-300 w-7 h-7"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" viewBox="0 0 24 24" class="dark:hidden" width="18" height="18" fill="currentColor"><path d="M12 18c-3.3 0-6-2.7-6-6s2.7-6 6-6 6 2.7 6 6-2.7 6-6 6zm0-10c-2.2 0-4 1.8-4 4s1.8 4 4 4 4-1.8 4-4-1.8-4-4-4zM12 4c-.6 0-1-.4-1-1V1c0-.6.4-1 1-1s1 .4 1 1v2c0 .6-.4 1-1 1zM12 24c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1s1 .4 1 1v2c0 .6-.4 1-1 1zM5.6 6.6c-.3 0-.5-.1-.7-.3L3.5 4.9c-.4-.4-.4-1 0-1.4s1-.4 1.4 0l1.4 1.4c.4.4.4 1 0 1.4-.1.2-.4.3-.7.3zM19.8 20.8c-.3 0-.5-.1-.7-.3l-1.4-1.4c-.4-.4-.4-1 0-1.4s1-.4 1.4 0l1.4 1.4c.4.4.4 1 0 1.4-.2.2-.5.3-.7.3zM3 13H1c-.6 0-1-.4-1-1s.4-1 1-1h2c.6 0 1 .4 1 1s-.4 1-1 1zM23 13h-2c-.6 0-1-.4-1-1s.4-1 1-1h2c.6 0 1 .4 1 1s-.4 1-1 1zM4.2 20.8c-.3 0-.5-.1-.7-.3-.4-.4-.4-1 0-1.4l1.4-1.4c.4-.4 1-.4 1.4 0s.4 1 0 1.4l-1.4 1.4c-.2.2-.4.3-.7.3zM18.4 6.6c-.3 0-.5-.1-.7-.3-.4-.4-.4-1 0-1.4l1.4-1.4c.4-.4 1-.4 1.4 0s.4 1 0 1.4l-1.4 1.4c-.2.2-.5.3-.7.3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" viewBox="0 0 24 24" class="hidden dark:block" width="18" height="18" fill="currentColor"><path d="M12.1 22h-.9c-5.5-.5-9.5-5.4-9-10.9.4-4.8 4.2-8.6 9-9 .4 0 .8.2 1 .5.2.3.2.8-.1 1.1-2 2.7-1.4 6.4 1.3 8.4 2.1 1.6 5 1.6 7.1 0 .3-.2.7-.3 1.1-.1.3.2.5.6.5 1-.2 2.7-1.5 5.1-3.6 6.8-1.9 1.4-4.1 2.2-6.4 2.2zM9.3 4.4c-2.9 1-5 3.6-5.2 6.8-.4 4.4 2.8 8.3 7.2 8.7 2.1.2 4.2-.4 5.8-1.8 1.1-.9 1.9-2.1 2.4-3.4-2.5.9-5.3.5-7.5-1.1-2.8-2.2-3.9-5.9-2.7-9.2z"></path></svg></div></div></div><div class="social-links menu-item_93d67 flex-center relative"><div class="flex-center h-full gap-x-4 transition-colors duration-300 md:mr-2"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/module-tools" target="_blank" rel="noopener noreferrer" class="social-links"><div class="social-links-icon_93d67"><svg role="img" viewBox="0 0 24 24" width="24" height="24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></div></a></div></div></div></div><div class="mobileNavMenu_f6cde"><div class="navScreen_457e8 " id="navScreen"><div class="container_457e8"><div class="navMenu_457e8"><div class="navMenuItem_457e8 w-full"><a class="link_03735 cursor-pointer" target="" href="/module-tools/guide/intro/welcome.html"><div class="rspress-nav-menu-item singleItem_f6cde activeItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">指南</div></a></div><div class="navMenuItem_457e8 w-full"><a class="link_03735 cursor-pointer" target="" href="/module-tools/api/index.html"><div class="rspress-nav-menu-item singleItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">API</div></a></div><div class="navMenuItem_457e8 w-full"><a class="link_03735 cursor-pointer" target="" href="/module-tools/plugins/guide/getting-started.html"><div class="rspress-nav-menu-item singleItem_f6cde text-sm font-medium mx-1.5 px-3 py-2 flex items-center">插件</div></a></div><div class="navMenuItem_457e8 w-full"><div class="mx-3 last:mr-0"><div class=" navScreenMenuGroup_457e8 relative"><button class="button_457e8"><span class="buttonSpan_457e8">v2.60.1</span><svg width="1em" height="1em" viewBox="0 0 32 32" class=" down_457e8 "><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div><div class="items_457e8"><div><div class="py-1 font-medium"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/module-tools/CHANGELOG.md" target="_blank" rel="noopener noreferrer" class="link_03735 "><div><div class="flex justify-center"><span>更新日志</span></div></div></a></div></div><div><div class="py-1 font-medium"><a href="https://modernjs.dev/en/community/contributing-guide.html" target="_blank" rel="noopener noreferrer" class="link_03735 "><div><div class="flex justify-center"><span>贡献指南</span></div></div></a></div></div></div></div></div></div></div></div><div class="flex-center flex-col gap-2"><div class="mt-2 navAppearance_457e8 flex justify-center"></div><div class="flex text-sm font-bold justify-center"><div class="mx-1.5 my-1"><div class=" navScreenMenuGroup_457e8 relative"><button class="button_457e8"><span class="buttonSpan_457e8"><svg width="18" height="18" viewBox="0 0 32 32" style="width:18px;height:18px"><path fill="currentColor" d="M27.85 29H30l-6-15h-2.35l-6 15h2.15l1.6-4h6.85zm-7.65-6 2.62-6.56L25.45 23zM18 7V5h-7V2H9v3H2v2h10.74a14.71 14.71 0 0 1-3.19 6.18A13.5 13.5 0 0 1 7.26 9h-2.1a16.47 16.47 0 0 0 3 5.58A16.84 16.84 0 0 1 3 18l.75 1.86A18.47 18.47 0 0 0 9.53 16a16.92 16.92 0 0 0 5.76 3.84L16 18a14.48 14.48 0 0 1-5.12-3.37A17.64 17.64 0 0 0 14.8 7z"></path></svg></span><svg width="1em" height="1em" viewBox="0 0 32 32" class=" down_457e8 "><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></button><div><div class="items_457e8"><div><div class="p-1 text-center"><span class="text-brand">简体中文</span></div></div><div><div class="py-1 font-medium"><a class="link_03735 cursor-pointer" target="" href="/module-tools/en/guide/faq/storybook.html"><div><div class="flex justify-center"><span>English</span></div></div></a></div></div></div></div></div></div></div><div class="social-links menu-item_93d67 flex-center relative"><div class="flex-center h-full gap-x-4 transition-colors duration-300 md:mr-2"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/module-tools" target="_blank" rel="noopener noreferrer" class="social-links"><div class="social-links-icon_93d67"><svg role="img" viewBox="0 0 24 24" width="24" height="24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg></div></a></div></div></div></div></div><button aria-label="mobile hamburger" class=" navHamburger_e7b06 text-gray-500"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="currentColor"><circle cx="8" cy="16" r="2" fill="currentColor"></circle><circle cx="16" cy="16" r="2" fill="currentColor"></circle><circle cx="24" cy="16" r="2" fill="currentColor"></circle></svg></button></div></div></div></div><section><div class="docLayout_edeb4 pt-0"><div class="rspress-sidebar-menu"><button class="flex-center mr-auto"><div class="text-md mr-2"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M4 6h24v2H4zm0 18h24v2H4zm0-12h24v2H4zm0 6h24v2H4z"></path></svg></div><span class="text-sm">Menu</span></button><button class="flex-center ml-auto"><span class="text-sm">目录</span><div class="text-md mr-2" style="transform:rotate(0deg);transition:transform 0.2s ease-out;margin-top:2px"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></button></div><aside class="sidebar_71eca rspress-sidebar "><div class="navTitleMask_71eca"><div class="navBarTitle_f6cde"><a href="/module-tools/" class="flex items-center w-full h-full text-base font-semibold transition-opacity duration-300 hover:opacity-60"><span>Modern.js Module</span></a></div></div><div class="rspress-scrollbar sidebarContent_71eca"><nav class="pb-2"><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center" style="font-size:14px">介绍</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/intro/welcome.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>欢迎使用</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/intro/why-module-engineering-solution.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>为什么需要 Modern.js Module</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/intro/getting-started.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>快速开始</span></div></a></div></div></div></section><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center" style="font-size:14px">基础使用</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/before-getting-started.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>开始之前</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/command-preview.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>CLI 命令</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/modify-output-product.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>修改输出产物</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/use-micro-generator.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>使用微生成器</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/use-module-doc.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>开发模块文档</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/using-storybook.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>使用 Storybook</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/basic/publish-your-project.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>版本管理与发布</span></div></a></div></div></div></section><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center" style="font-size:14px">进阶指南</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/advance/in-depth-about-build.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>深入理解构建</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/advance/in-depth-about-dev-command.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>深入理解 dev 命令</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/advance/copy.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>使用 Copy 工具</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/advance/external-dependency.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>处理三方依赖</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/advance/build-umd.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>构建 umd 产物</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/advance/asset.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>处理静态资源</span></div></a></div></div></div></section><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center" style="font-size:14px">最佳实践</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/best-practices/components.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>开发组件</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/best-practices/use-tailwindcss.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>使用 Tailwind CSS</span></div></a></div></div></div></section><section class="mt-0.5 block" style="margin-left:0"><div class="flex justify-between items-center menuItem_71eca" style="border-radius:0 var(--rp-radius) var(--rp-radius) 0;cursor:pointer"><h2 class="py-2 px-3 text-sm font-medium flex" style="font-size:14px;padding-left:24px;font-weight:bold"><span class="flex-center" style="font-size:14px">常见问题</span></h2><div class="collapseContainer_71eca p-2 rounded-xl"><div style="cursor:pointer;transition:transform 0.2s ease-out;transform:rotate(90deg)"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></div></div></div><div class="transition-all duration-300 ease-in-out" style="overflow:hidden"><div class="rspress-sidebar-group transition-opacity duration-500 ease-in-out" style="opacity:1;margin-left:12px"><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/faq/basic.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>通用类问题</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/faq/build.html"><div class="menuItem_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>构建相关问题</span></div></a></div><div><a class="link_03735 menuLink_71eca cursor-pointer" target="" href="/module-tools/guide/faq/storybook.html"><div class="menuItemActive_71eca mt-0.5 py-2 px-3 font-medium flex" style="font-size:13px;margin-left:18px;border-radius:0 var(--rp-radius) var(--rp-radius) 0"><span>Storybook 相关问题</span></div></a></div></div></div></section></nav></div></aside><div class="content_edeb4 rspress-doc-container flex flex-shrink-0 mx-auto"><div class="w-full flex-1"><div><div class="rspress-doc"><!--$--><h1 id="storybook-相关问题" class="text-3xl mb-10 leading-10 tracking-tight title_3b154">Storybook 相关问题<a class="link_3b154 header-anchor" aria-hidden="true" href="#storybook-相关问题">#</a></h1>
|
|
14
|
+
<h2 id="支持-storybook-v7" class="mt-12 mb-6 pt-8 text-2xl tracking-tight border-t-[1px] border-divider-light title_3b154">支持 Storybook v7<a class="link_3b154 header-anchor" aria-hidden="true" href="#支持-storybook-v7">#</a></h2>
|
|
15
|
+
<p class="my-4 leading-7">Storybook v7 目前已全面支持并已成为我们的推荐使用版本。</p>
|
|
16
|
+
<h2 id="使用-storybook-addon-或者其他配置不生效" class="mt-12 mb-6 pt-8 text-2xl tracking-tight border-t-[1px] border-divider-light title_3b154">使用 Storybook Addon 或者其他配置不生效<a class="link_3b154 header-anchor" aria-hidden="true" href="#使用-storybook-addon-或者其他配置不生效">#</a></h2>
|
|
17
|
+
<p class="my-4 leading-7">Modern.js Module 目前使用的 Storybook 版本是 v6,如果使用了 v7 版本的 Addon 可能会出现插件不生效的情况。</p>
|
|
18
|
+
<p class="my-4 leading-7">除了 Addon 以外,其他配置也可能会有区别。比如修改 <code>preview.js</code> 配置文件的话,Storybook v6 与 v7 的写法也不相同:</p>
|
|
19
|
+
<ul class="list-disc pl-5 my-4 leading-7">
|
|
20
|
+
<li class="[&:not(:first-child)]:mt-2">v6:<a target="_blank" rel="noopener noreferrer" href="https://storybook.js.org/docs/6.5/react/writing-stories/decorators#global-decorators" class="link_03735 link_3b154 inline-link_3b154">文档链接</a></li>
|
|
21
|
+
<li class="[&:not(:first-child)]:mt-2">v7:<a target="_blank" rel="noopener noreferrer" href="https://storybook.js.org/docs/react/writing-stories/decorators#global-decorators" class="link_03735 link_3b154 inline-link_3b154">文档链接</a></li>
|
|
22
|
+
</ul>
|
|
23
|
+
<h2 id="cannot-find-module-react-dompackagejson" class="mt-12 mb-6 pt-8 text-2xl tracking-tight border-t-[1px] border-divider-light title_3b154">Cannot find module 'react-dom/package.json'<a class="link_3b154 header-anchor" aria-hidden="true" href="#cannot-find-module-react-dompackagejson">#</a></h2>
|
|
24
|
+
<p class="my-4 leading-7">在执行 Storybook 调试的时候,出现下面的报错提示:</p>
|
|
25
|
+
<div class="language-bash"><div class="rspress-code-content rspress-scrollbar"><div><pre class="code" style="background-color:inherit"><code class="language-bash" style="white-space:pre"><span style="display:block;padding:0 1.25rem"><span>ERR</span><span class="token operator">!</span><span> Error: Cannot </span><span class="token" style="color:var(--code-token-function)">find</span><span> module </span><span class="token" style="color:var(--code-token-string)">'react-dom/package.json'</span></span></code></pre></div><div class="code-button-group_15153"><button title="Toggle code wrap"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrapped_15153"><path fill="#22a041" d="M21 5H3v2h18zM3 19h7v-2H3zm0-6h15c1 0 2 .43 2 2s-1 2-2 2h-2v-2l-4 3 4 3v-2h2c2.95 0 4-1.27 4-4 0-2.72-1-4-4-4H3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrap_15153"><path fill="currentColor" d="M16 7H3V5h13v2M3 19h13v-2H3v2m19-7-4-3v2H3v2h15v2l4-3Z"></path></svg></button><button class="code-copy-button_15153" title="Copy code"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 30 30" class="icon-copy_15153"><path fill="currentColor" d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"></path><path fill="currentColor" d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"></path></svg><svg width="32" height="32" viewBox="0 0 30 30" class="icon-success_15153"><path fill="#49cd37" d="m13 24-9-9 1.414-1.414L13 21.171 26.586 7.586 28 9 13 24z"></path></svg></button></div></div></div>
|
|
26
|
+
<p class="my-4 leading-7">解决办法:在项目中安装 <code>react-dom</code> 依赖。</p>
|
|
27
|
+
<div class="language-json"><div class="rspress-code-content rspress-scrollbar"><div><pre class="code" style="background-color:inherit"><code class="language-json" style="white-space:pre"><span style="display:block;padding:0 1.25rem"><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
|
|
28
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-parameter)">"devDependencies"</span><span class="token operator">:</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
|
|
29
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-parameter)">"react-dom"</span><span class="token operator">:</span><span> </span><span class="token" style="color:var(--code-token-string)">"^17"</span><span>
|
|
30
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span>
|
|
31
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-punctuation)">}</span></span></code></pre></div><div class="code-button-group_15153"><button title="Toggle code wrap"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrapped_15153"><path fill="#22a041" d="M21 5H3v2h18zM3 19h7v-2H3zm0-6h15c1 0 2 .43 2 2s-1 2-2 2h-2v-2l-4 3 4 3v-2h2c2.95 0 4-1.27 4-4 0-2.72-1-4-4-4H3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrap_15153"><path fill="currentColor" d="M16 7H3V5h13v2M3 19h13v-2H3v2m19-7-4-3v2H3v2h15v2l4-3Z"></path></svg></button><button class="code-copy-button_15153" title="Copy code"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 30 30" class="icon-copy_15153"><path fill="currentColor" d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"></path><path fill="currentColor" d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"></path></svg><svg width="32" height="32" viewBox="0 0 30 30" class="icon-success_15153"><path fill="#49cd37" d="m13 24-9-9 1.414-1.414L13 21.171 26.586 7.586 28 9 13 24z"></path></svg></button></div></div></div>
|
|
32
|
+
<h2 id="报错后看不到具体报错信息" class="mt-12 mb-6 pt-8 text-2xl tracking-tight border-t-[1px] border-divider-light title_3b154">报错后,看不到具体报错信息<a class="link_3b154 header-anchor" aria-hidden="true" href="#报错后看不到具体报错信息">#</a></h2>
|
|
33
|
+
<p class="my-4 leading-7">解决办法:</p>
|
|
34
|
+
<ol class="list-decimal pl-5 my-4 leading-7">
|
|
35
|
+
<li class="[&:not(:first-child)]:mt-2">找到 <code>@storybook/core-server/dist/cjs/dev-server.js</code></li>
|
|
36
|
+
<li class="[&:not(:first-child)]:mt-2">找到 <code>var _await$Promise$all = await Promise.all([preview, manager</code> 这附近的代码。</li>
|
|
37
|
+
<li class="[&:not(:first-child)]:mt-2">修改成:</li>
|
|
38
|
+
</ol>
|
|
39
|
+
<div class="language-js"><div class="rspress-code-content rspress-scrollbar"><div><pre class="code" style="background-color:inherit"><code class="language-js" style="white-space:pre"><span style="display:block;padding:0 1.25rem"><span class="token" style="color:var(--code-token-keyword)">var</span><span> _await$Promise$all </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-keyword)">await</span><span> Promise</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token" style="color:var(--code-token-function)">all</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">[</span><span>
|
|
40
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> preview</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token" style="color:var(--code-token-function)">catch</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token parameter">e</span><span> </span><span class="token operator">=></span><span> console</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token" style="color:var(--code-token-function)">info</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>e</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span>
|
|
41
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> manager </span><span class="token" style="color:var(--code-token-comment)">// TODO #13083 Restore this when compiling the preview is fast enough</span><span>
|
|
42
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-comment)">// .then((result) => {</span><span>
|
|
43
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-comment)">// if (!options.ci && !options.smokeTest) openInBrowser(address);</span><span>
|
|
44
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-comment)">// return result;</span><span>
|
|
45
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-comment)">// })</span><span>
|
|
46
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token" style="color:var(--code-token-function)">catch</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>previewBuilder</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span>bail</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">]</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span>
|
|
47
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> _await$Promise$all2 </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-function)">_slicedToArray</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span>_await$Promise$all</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> </span><span class="token number">2</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span>
|
|
48
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> previewResult </span><span class="token operator">=</span><span> _await$Promise$all2</span><span class="token" style="color:var(--code-token-punctuation)">[</span><span class="token number">0</span><span class="token" style="color:var(--code-token-punctuation)">]</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span>
|
|
49
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> managerResult </span><span class="token operator">=</span><span> _await$Promise$all2</span><span class="token" style="color:var(--code-token-punctuation)">[</span><span class="token number">1</span><span class="token" style="color:var(--code-token-punctuation)">]</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span> </span><span class="token" style="color:var(--code-token-comment)">// TODO #13083 Remove this when compiling the preview is fast enough</span></span></code></pre></div><div class="code-button-group_15153"><button title="Toggle code wrap"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrapped_15153"><path fill="#22a041" d="M21 5H3v2h18zM3 19h7v-2H3zm0-6h15c1 0 2 .43 2 2s-1 2-2 2h-2v-2l-4 3 4 3v-2h2c2.95 0 4-1.27 4-4 0-2.72-1-4-4-4H3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrap_15153"><path fill="currentColor" d="M16 7H3V5h13v2M3 19h13v-2H3v2m19-7-4-3v2H3v2h15v2l4-3Z"></path></svg></button><button class="code-copy-button_15153" title="Copy code"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 30 30" class="icon-copy_15153"><path fill="currentColor" d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"></path><path fill="currentColor" d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"></path></svg><svg width="32" height="32" viewBox="0 0 30 30" class="icon-success_15153"><path fill="#49cd37" d="m13 24-9-9 1.414-1.414L13 21.171 26.586 7.586 28 9 13 24z"></path></svg></button></div></div></div>
|
|
50
|
+
<h2 id="couldnt-find-any-stories-is-your-storybook" class="mt-12 mb-6 pt-8 text-2xl tracking-tight border-t-[1px] border-divider-light title_3b154">Couldn't find any stories is your Storybook<a class="link_3b154 header-anchor" aria-hidden="true" href="#couldnt-find-any-stories-is-your-storybook">#</a></h2>
|
|
51
|
+
<p class="my-4 leading-7"><img src="https://lf3-static.bytednsdoc.com/obj/eden-cn/shylnyhaeh7uldvivhn/screenshot-20230703-162111.png" alt="storybook-error"/></p>
|
|
52
|
+
<p class="my-4 leading-7">当在预览区域看到类似这样的报错提示的时候,首先可以打开一下浏览器的控制台,应该会有些报错信息。可以先根据报错信息来推断是不是编写代码里出现的问题导致 Storybook 无法正常运行。修复后,再次刷新查看是否正常。</p>
|
|
53
|
+
<h2 id="storybook-添加-proxy-功能" class="mt-12 mb-6 pt-8 text-2xl tracking-tight border-t-[1px] border-divider-light title_3b154">Storybook 添加 Proxy 功能<a class="link_3b154 header-anchor" aria-hidden="true" href="#storybook-添加-proxy-功能">#</a></h2>
|
|
54
|
+
<p class="my-4 leading-7">Storybook 没有提供相关方案,不过 Storybook Issue 中有找到相关的解决办法。在 Modern.js Module 中,你可以:</p>
|
|
55
|
+
<ol class="list-decimal pl-5 my-4 leading-7">
|
|
56
|
+
<li class="[&:not(:first-child)]:mt-2">添加 <code>.storybook/middleware.js</code> 文件,并初始化下面的内容:</li>
|
|
57
|
+
</ol>
|
|
58
|
+
<div class="language-js"><div class="rspress-code-content rspress-scrollbar"><div><pre class="code" style="background-color:inherit"><code class="language-js" style="white-space:pre"><span style="display:block;padding:0 1.25rem"><span class="token" style="color:var(--code-token-comment)">/* eslint-disable filenames/match-exported */</span><span>
|
|
59
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span>module</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token function-variable" style="color:var(--code-token-function)">exports</span><span> </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-keyword)">function</span><span> </span><span class="token" style="color:var(--code-token-function)">expressMiddleware</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token parameter">router</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
|
|
60
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-comment)">// router is express router</span><span>
|
|
61
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-comment)">// import { Router } from 'express'</span><span>
|
|
62
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-comment)">// router = new Router();</span><span>
|
|
63
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">;</span></span></code></pre></div><div class="code-button-group_15153"><button title="Toggle code wrap"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrapped_15153"><path fill="#22a041" d="M21 5H3v2h18zM3 19h7v-2H3zm0-6h15c1 0 2 .43 2 2s-1 2-2 2h-2v-2l-4 3 4 3v-2h2c2.95 0 4-1.27 4-4 0-2.72-1-4-4-4H3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrap_15153"><path fill="currentColor" d="M16 7H3V5h13v2M3 19h13v-2H3v2m19-7-4-3v2H3v2h15v2l4-3Z"></path></svg></button><button class="code-copy-button_15153" title="Copy code"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 30 30" class="icon-copy_15153"><path fill="currentColor" d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"></path><path fill="currentColor" d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"></path></svg><svg width="32" height="32" viewBox="0 0 30 30" class="icon-success_15153"><path fill="#49cd37" d="m13 24-9-9 1.414-1.414L13 21.171 26.586 7.586 28 9 13 24z"></path></svg></button></div></div></div>
|
|
64
|
+
<ol start="2" class="list-decimal pl-5 my-4 leading-7">
|
|
65
|
+
<li class="[&:not(:first-child)]:mt-2">添加 http-proxy-middleware 依赖</li>
|
|
66
|
+
<li class="[&:not(:first-child)]:mt-2">添加代理路由相关配置</li>
|
|
67
|
+
</ol>
|
|
68
|
+
<div class="language-js"><div class="rspress-code-content rspress-scrollbar"><div><pre class="code" style="background-color:inherit"><code class="language-js" style="white-space:pre"><span style="display:block;padding:0 1.25rem"><span class="token" style="color:var(--code-token-comment)">/* eslint-disable filenames/match-exported */</span><span>
|
|
69
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-keyword)">const</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span> createProxyMiddleware </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span> </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-function)">require</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-string)">"http-proxy-middleware"</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">;</span><span>
|
|
70
|
+
</span></span><span style="display:block;padding:0 1.25rem">
|
|
71
|
+
</span><span style="display:block;padding:0 1.25rem"><span>module</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token function-variable" style="color:var(--code-token-function)">exports</span><span> </span><span class="token operator">=</span><span> </span><span class="token" style="color:var(--code-token-keyword)">function</span><span> </span><span class="token" style="color:var(--code-token-function)">expressMiddleware</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token parameter">router</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span> </span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
|
|
72
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> router</span><span class="token" style="color:var(--code-token-punctuation)">.</span><span class="token" style="color:var(--code-token-function)">use</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-string)">'/api'</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span> </span><span class="token" style="color:var(--code-token-function)">createProxyMiddleware</span><span class="token" style="color:var(--code-token-punctuation)">(</span><span class="token" style="color:var(--code-token-punctuation)">{</span><span>
|
|
73
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token literal-property" style="color:var(--code-token-parameter)">target</span><span class="token operator">:</span><span> </span><span class="token" style="color:var(--code-token-string)">"http://localhost:8000"</span><span class="token" style="color:var(--code-token-punctuation)">,</span><span>
|
|
74
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token literal-property" style="color:var(--code-token-parameter)">changeOrigin</span><span class="token operator">:</span><span> </span><span class="token boolean">true</span><span>
|
|
75
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span> </span><span class="token" style="color:var(--code-token-punctuation)">}</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span class="token" style="color:var(--code-token-punctuation)">)</span><span>
|
|
76
|
+
</span></span><span style="display:block;padding:0 1.25rem"><span></span><span class="token" style="color:var(--code-token-punctuation)">}</span></span></code></pre></div><div class="code-button-group_15153"><button title="Toggle code wrap"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrapped_15153"><path fill="#22a041" d="M21 5H3v2h18zM3 19h7v-2H3zm0-6h15c1 0 2 .43 2 2s-1 2-2 2h-2v-2l-4 3 4 3v-2h2c2.95 0 4-1.27 4-4 0-2.72-1-4-4-4H3z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class="icon-wrap_15153"><path fill="currentColor" d="M16 7H3V5h13v2M3 19h13v-2H3v2m19-7-4-3v2H3v2h15v2l4-3Z"></path></svg></button><button class="code-copy-button_15153" title="Copy code"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 30 30" class="icon-copy_15153"><path fill="currentColor" d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z"></path><path fill="currentColor" d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z"></path></svg><svg width="32" height="32" viewBox="0 0 30 30" class="icon-success_15153"><path fill="#49cd37" d="m13 24-9-9 1.414-1.414L13 21.171 26.586 7.586 28 9 13 24z"></path></svg></button></div></div></div>
|
|
77
|
+
<p class="my-4 leading-7">相关 issue 链接:<a target="_blank" rel="noopener noreferrer" href="https://github.com/storybookjs/storybook/issues/11551" class="link_03735 link_3b154 inline-link_3b154">#11551</a>。</p>
|
|
78
|
+
<h2 id="tailwind-css-在-storybook-中不生效" class="mt-12 mb-6 pt-8 text-2xl tracking-tight border-t-[1px] border-divider-light title_3b154">Tailwind CSS 在 Storybook 中不生效<a class="link_3b154 header-anchor" aria-hidden="true" href="#tailwind-css-在-storybook-中不生效">#</a></h2>
|
|
79
|
+
<p class="my-4 leading-7">Modern.js Module 的 Storybook 构建能力由 <a target="_blank" rel="noopener noreferrer" href="https://rsbuild.dev/" class="link_03735 link_3b154 inline-link_3b154">Rsbuild</a> 提供,由于 Rsbuild 的底层实现与 Modern.js Module 并未打通,因此, Modern.js Module 插件无法在 Storybook (Rsbuild) 中生效。</p>
|
|
80
|
+
<p class="my-4 leading-7">解决办法:需要在 storybook 中单独注册 tailwindcss 的 PostCSS 插件。</p>
|
|
81
|
+
<p class="my-4 leading-7">参考链接:<a target="_blank" rel="noopener noreferrer" href="https://rsbuild.dev/zh/guide/basic/tailwindcss#%E9%85%8D%E7%BD%AE-postcss" class="link_03735 link_3b154 inline-link_3b154">Rsbuild - tailwindcss</a>。</p><!--/$--></div><div class="rspress-doc-footer"><footer class="mt-8"><div class="xs:flex pb-5 px-2 justify-end items-center"></div><div class="flex flex-col"><a href="https://github.com/web-infra-dev/modern.js/tree/main/packages/document/module-doc/docs/zh/guide/faq/storybook.mdx" target="_blank" class="editLink_2a169">Edit this page on GitHub</a></div><div class="flex flex-col sm:flex-row sm:justify-around gap-4 pt-6"><div class="prev_e7091 flex flex-col"><a class="link_03735 pager-link_9b9a7 cursor-pointer" target="" href="/module-tools/guide/faq/build.html"><span class="desc_9b9a7">上一页</span><span class="title_9b9a7">构建相关问题</span></a></div><div class="next_e7091 flex flex-col"></div></div></footer></div></div></div><div class="aside-container_edeb4"><div><div class="flex flex-col"><div class="<lg:hidden"><div id="aside-container" class="relative text-sm font-medium"><div class="leading-7 block text-sm font-semibold pl-3">目录</div><nav class="mt-1"><ul class="relative"><li><a href="#支持-storybook-v7" title="支持 Storybook v7" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="margin-left:0;font-weight:semibold"><span class="aside-link-text block">支持 Storybook v7</span></a></li><li><a href="#使用-storybook-addon-或者其他配置不生效" title="使用 Storybook Addon 或者其他配置不生效" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="margin-left:0;font-weight:semibold"><span class="aside-link-text block">使用 Storybook Addon 或者其他配置不生效</span></a></li><li><a href="#cannot-find-module-react-dompackagejson" title="Cannot find module 'react-dom/package.json'" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="margin-left:0;font-weight:semibold"><span class="aside-link-text block">Cannot find module 'react-dom/package.json'</span></a></li><li><a href="#报错后看不到具体报错信息" title="报错后,看不到具体报错信息" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="margin-left:0;font-weight:semibold"><span class="aside-link-text block">报错后,看不到具体报错信息</span></a></li><li><a href="#couldnt-find-any-stories-is-your-storybook" title="Couldn't find any stories is your Storybook" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="margin-left:0;font-weight:semibold"><span class="aside-link-text block">Couldn't find any stories is your Storybook</span></a></li><li><a href="#storybook-添加-proxy-功能" title="Storybook 添加 Proxy 功能" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="margin-left:0;font-weight:semibold"><span class="aside-link-text block">Storybook 添加 Proxy 功能</span></a></li><li><a href="#tailwind-css-在-storybook-中不生效" title="Tailwind CSS 在 Storybook 中不生效" class="aside-link transition-all duration-300 hover:text-text-1 text-text-2 block" style="margin-left:0;font-weight:semibold"><span class="aside-link-text block">Tailwind CSS 在 Storybook 中不生效</span></a></li></ul></nav></div></div></div></div></div></div></div></section></div></div>
|
|
82
|
+
<div id="search-container"></div>
|
|
83
|
+
</body>
|
|
84
|
+
|
|
85
|
+
</html>
|