180 lines
114 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en-US" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>插件 API | Fes.js</title>
<meta name="description" content="一个好用的前端应用解决方案">
<link rel="preload stylesheet" href="/fes.js/assets/style.989bd2a0.css" as="style">
<script type="module" src="/fes.js/assets/app.a0124bc8.js"></script>
<link rel="preload" href="/fes.js/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
<link rel="modulepreload" href="/fes.js/assets/chunks/framework.b31a4d00.js">
<link rel="modulepreload" href="/fes.js/assets/chunks/theme.72deb38a.js">
<link rel="modulepreload" href="/fes.js/assets/reference_plugin_dev_api.md.2d7e42be.lean.js">
<link rel="icon" href="/logo.png">
<script id="check-dark-light">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
</head>
<body>
<div id="app"><div class="Layout" data-v-600cd4bc><!--[--><!--]--><!--[--><span tabindex="-1" data-v-2d2e5156></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-2d2e5156> Skip to content </a><!--]--><!----><header class="VPNav" data-v-600cd4bc data-v-10c2e836><div class="VPNavBar has-sidebar" data-v-10c2e836 data-v-c6988a15><div class="container" data-v-c6988a15><div class="title" data-v-c6988a15><div class="VPNavBarTitle has-sidebar" data-v-c6988a15 data-v-e846412e><a class="title" href="/fes.js/" data-v-e846412e><!--[--><!--]--><!--[--><img class="VPImage logo" src="/fes.js/logo.png" alt data-v-21926a76><!--]--><!--[-->Fes.js<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-c6988a15><div class="curtain" data-v-c6988a15></div><div class="content-body" data-v-c6988a15><!--[--><!--]--><div class="VPNavBarSearch search" style="--vp-meta-key:&#39;Meta&#39;;" data-v-c6988a15><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-c6988a15 data-v-6d4a3966><span id="main-nav-aria-label" class="visually-hidden" data-v-6d4a3966>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/fes.js/guide/" tabindex="0" data-v-6d4a3966 data-v-a55142e6 data-v-15014769><!--[-->指南<!--]--><!----></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/fes.js/reference/config/" tabindex="0" data-v-6d4a3966 data-v-a55142e6 data-v-15014769><!--[-->编译时配置<!--]--><!----></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/fes.js/reference/api/" tabindex="0" data-v-6d4a3966 data-v-a55142e6 data-v-15014769><!--[-->API<!--]--><!----></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/fes.js/reference/plugin/" tabindex="0" data-v-6d4a3966 data-v-a55142e6 data-v-15014769><!--[-->插件<!--]--><!----></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/fes.js/reference/cli/index.html" tabindex="0" data-v-6d4a3966 data-v-a55142e6 data-v-15014769><!--[-->CLI<!--]--><!----></a><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-6d4a3966 data-v-405aaae9><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-405aaae9><span class="text" data-v-405aaae9><!----> v3.2.1 <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="text-icon" data-v-405aaae9><path d="M12,16c-0.3,0-0.5-0.1-0.7-0.3l-6-6c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l5.3,5.3l5.3-5.3c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-6,6C12.5,15.9,12.3,16,12,16z"></path></svg></span></button><div class="menu" data-v-405aaae9><div class="VPMenu" data-v-405aaae9 data-v-14225c89><div class="items" data-v-14225c89><!--[--><!--[--><div class="VPMenuLink" data-v-14225c89 data-v-d28afc9d><a class="VPLink link" href="https://fesjs.mumblefe.cn/2.0/" target="_blank" rel="noreferrer" data-v-d28afc9d data-v-15014769><!--[-->v2.0<!--]--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="icon" data-v-15014769><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-14225c89 data-v-d28afc9d><a class="VPLink link" href="https://fesjs.mumblefe.cn/1.0/" target="_blank" rel="noreferrer" data-v-d28afc9d data-v-15014769><!--[-->v1.0<!--]--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="icon" data-v-15014769><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--[--><div class="VPFlyout VPNavBarMenuGroup" data-v-6d4a3966 data-v-405aaae9><button type="button" class="button" aria-haspopup="true" aria-expanded="false" data-v-405aaae9><span class="text" data-v-405aaae9><!----> 了解更多 <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="text-icon" data-v-405aaae9><path d="M12,16c-0.3,0-0.5-0.1-0.7-0.3l-6-6c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l5.3,5.3l5.3-5.3c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-6,6C12.5,15.9,12.3,16,12,16z"></path></svg></span></button><div class="menu" data-v-405aaae9><div class="VPMenu" data-v-405aaae9 data-v-14225c89><div class="items" data-v-14225c89><!--[--><!--[--><div class="VPMenuLink" data-v-14225c89 data-v-d28afc9d><a class="VPLink link" href="https://github.com/WeBankFinTech/fes.js/blob/master/CHANGELOG.md" target="_blank" rel="noreferrer" data-v-d28afc9d data-v-15014769><!--[-->更新日志<!--]--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="icon" data-v-15014769><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a></div><!--]--><!--[--><div class="VPMenuLink" data-v-14225c89 data-v-d28afc9d><a class="VPLink link" href="http://fes-design.mumblefe.cn/" target="_blank" rel="noreferrer" data-v-d28afc9d data-v-15014769><!--[-->fes-design<!--]--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" height="24px" viewbox="0 0 24 24" width="24px" class="icon" data-v-15014769><path d="M0 0h24v24H0V0z" fill="none"></path><path d="M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z"></path></svg></a></div><!--]--><!--]--></div><!--[--><!--]--></div></div></div><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-c6988a15 data-v-5db6483e><label title="toggle dark mode" data-v-5db6483e data-v-cd2add99><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" aria-checked="false" data-v-cd2add99 data-v-48d1a158><span class="check" data-v-48d1a158><span class="icon" data-v-48d1a158><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-cd2add99><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-cd2add99><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></label></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-c6988a15 data-v-f70744fe data-v-d7bdad6c><!--[--><a class="VPSocialLink" href="https://github.com/WeBankFinTech/fes.js" aria-label="github" target="_blank" rel="noopener" data-v-d7bdad6c data-v-c4402a71><svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-c6988a15 data-v-3ce128b5 data-v-405aaae9><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-405aaae9><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-405aaae9><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-405aaae9><div class="VPMenu" data-v-405aaae9 data-v-14225c89><!----><!--[--><!--[--><!----><div class="group" data-v-3ce128b5><div class="item appearance" data-v-3ce128b5><p class="label" data-v-3ce128b5>Appearance</p><div class="appearance-action" data-v-3ce128b5><label title="toggle dark mode" data-v-3ce128b5 data-v-cd2add99><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" aria-checked="false" data-v-cd2add99 data-v-48d1a158><span class="check" data-v-48d1a158><span class="icon" data-v-48d1a158><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-cd2add99><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-cd2add99><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></label></div></div></div><div class="group" data-v-3ce128b5><div class="item social-links" data-v-3ce128b5><div class="VPSocialLinks social-links-list" data-v-3ce128b5 data-v-d7bdad6c><!--[--><a class="VPSocialLink" href="https://github.com/WeBankFinTech/fes.js" aria-label="github" target="_blank" rel="noopener" data-v-d7bdad6c data-v-c4402a71><svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-c6988a15 data-v-1cde4ba9><span class="container" data-v-1cde4ba9><span class="top" data-v-1cde4ba9></span><span class="middle" data-v-1cde4ba9></span><span class="bottom" data-v-1cde4ba9></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav" data-v-600cd4bc data-v-772b017f><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-772b017f><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-772b017f><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-772b017f>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-772b017f data-v-596c6466><button data-v-596c6466>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-600cd4bc data-v-b7ba390f><div class="curtain" data-v-b7ba390f></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b7ba390f><span class="visually-hidden" id="sidebar-aria-label" data-v-b7ba390f> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b7ba390f><section class="VPSidebarItem level-0" data-v-b7ba390f data-v-f8e6bbce><!----><div class="items" data-v-f8e6bbce><!--[--><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/index.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>介绍</p><!--]--><!----></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b7ba390f><section class="VPSidebarItem level-0" data-v-b7ba390f data-v-f8e6bbce><div class="item" role="button" tabindex="0" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><h2 class="text" data-v-f8e6bbce>Plugins</h2><!----></div><div class="items" data-v-f8e6bbce><!--[--><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/access.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-access</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/enums.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-enums</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/icon.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-icon</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/jest.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-jest</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/layout.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-layout</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/locale.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-locale</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/model.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-model</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/request.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-request</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/vuex.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-vuex</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/qiankun.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-qiankun</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/windicss.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-windicss</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/sass.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-sass</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/editor.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-editor</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/pinia.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-pinia</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/watermark.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-watermark</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/login.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-login</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/plugins/swc.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>@fesjs/plugin-swc</p><!--]--><!----></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b7ba390f><section class="VPSidebarItem level-0 has-active" data-v-b7ba390f data-v-f8e6bbce><div class="item" role="button" tabindex="0" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><h2 class="text" data-v-f8e6bbce>插件开发</h2><!----></div><div class="items" data-v-f8e6bbce><!--[--><div class="VPSidebarItem level-1 is-link" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/dev/index.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>插件介绍</p><!--]--><!----></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link is-active has-active" data-v-f8e6bbce data-v-f8e6bbce><div class="item" data-v-f8e6bbce><div class="indicator" data-v-f8e6bbce></div><a class="VPLink link link" href="/fes.js/reference/plugin/dev/api.html" data-v-f8e6bbce data-v-15014769><!--[--><p class="text" data-v-f8e6bbce>插件API</p><!--]--><!----></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-600cd4bc data-v-13c861a7><div class="VPDoc has-sidebar has-aside" data-v-13c861a7 data-v-9ca33bd6><!--[--><!--]--><div class="container" data-v-9ca33bd6><div class="aside" data-v-9ca33bd6><div class="aside-curtain" data-v-9ca33bd6></div><div class="aside-container" data-v-9ca33bd6><div class="aside-content" data-v-9ca33bd6><div class="VPDocAside" data-v-9ca33bd6 data-v-c111cd2e><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" data-v-c111cd2e data-v-a28777cb><div class="content" data-v-a28777cb><div class="outline-marker" data-v-a28777cb></div><div class="outline-title" data-v-a28777cb>本页目录</div><nav aria-labelledby="doc-outline-aria-label" data-v-a28777cb><span class="visually-hidden" id="doc-outline-aria-label" data-v-a28777cb> Table of Contents for current page </span><ul class="root" data-v-a28777cb data-v-36b4bfdb><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-c111cd2e></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-9ca33bd6><div class="content-container" data-v-9ca33bd6><!--[--><!--]--><!----><main class="main" data-v-9ca33bd6><div style="position:relative;" class="vp-doc _fes_js_reference_plugin_dev_api" data-v-9ca33bd6><div><h1 id="插件-api" tabindex="-1">插件 API <a class="header-anchor" href="#插件-api" aria-label="Permalink to &quot;插件 API&quot;"></a></h1><h2 id="属性" tabindex="-1">属性 <a class="header-anchor" href="#属性" aria-label="Permalink to &quot;属性&quot;"></a></h2><h3 id="api-paths" tabindex="-1">api.paths <a class="header-anchor" href="#api-paths" aria-label="Permalink to &quot;api.paths&quot;"></a></h3><p>一些关键的路径:</p><ul><li>cwd执行命令的绝对路径</li><li>absNodeModulesPathnodeModule 的绝对路径</li><li>absOutputPath输出 <code>build</code> 产物的绝对路径</li><li>absSrcPath<code>src</code> 目录的绝对路径</li><li>absPagesPath<code>pages</code>目录的绝对路径</li><li>absTmpPath<code>.fes</code>临时文件目录的绝对路径</li></ul><h3 id="api-cwd" tabindex="-1">api.cwd <a class="header-anchor" href="#api-cwd" aria-label="Permalink to &quot;api.cwd&quot;"></a></h3><p>执行命令的绝对路径</p><h3 id="api-pkg" tabindex="-1">api.pkg <a class="header-anchor" href="#api-pkg" aria-label="Permalink to &quot;api.pkg&quot;"></a></h3><p><code>package.json</code>的内容</p><h3 id="api-configinstance" tabindex="-1">api.configInstance <a class="header-anchor" href="#api-configinstance" aria-label="Permalink to &quot;api.configInstance&quot;"></a></h3><p><code>config</code>实例</p><h3 id="userconfig" tabindex="-1">userConfig <a class="header-anchor" href="#userconfig" aria-label="Permalink to &quot;userConfig&quot;"></a></h3><p>用户配置</p><h3 id="config" tabindex="-1">config <a class="header-anchor" href="#config" aria-label="Permalink to &quot;config&quot;"></a></h3><p>插件配置可被修改,此为最终的配置</p><h3 id="env" tabindex="-1">env <a class="header-anchor" href="#env" aria-label="Permalink to &quot;env&quot;"></a></h3><p>p<wbr>rocess.env</p><h3 id="args" tabindex="-1">args <a class="header-anchor" href="#args" aria-label="Permalink to &quot;args&quot;"></a></h3><p>环境变量</p><h2 id="核心方法" tabindex="-1">核心方法 <a class="header-anchor" href="#核心方法" aria-label="Permalink to &quot;核心方法&quot;"></a></h2><h3 id="describe" tabindex="-1">describe <a class="header-anchor" href="#describe" aria-label="Permalink to &quot;describe&quot;"></a></h3><p>注册阶段执行,用于描述插件或插件集的 id、key、配置信息、启用方式等。</p><p>用法:<strong>describe({ id?: string, key?: string, config?: { default, schema, onChange } }, enableBy?)</strong></p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">describe</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">key</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">esbuild</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">config</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">schema</span><span style="color:#89DDFF;">(</span><span style="color:#BABED8;font-style:italic;">joi</span><span style="color:#89DDFF;">)</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">joi</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">object</span><span style="color:#F07178;">()</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">default</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{},</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">enableBy</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> api</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">EnableBy</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">config</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><p>注:</p><ul><li><code>config.default</code> 为配置的默认值,用户没有配置时取这个</li><li><code>config.schema</code> 用于声明配置的类型,基于 <a href="https://hapi.dev/module/joi" target="_blank" rel="noreferrer">joi</a>,如果你希望用户进行配置,这个是必须的,否则用户的配置无效</li><li><code>config.onChange</code><code>dev</code> 阶段配置被修改后的处理机制,默认会重启 dev 进程,也可以修改为 api.ConfigChangeType.regenerateTmpFiles 只重新生成临时文件,还可以通过函数的格式自定义</li><li><code>enableBy</code> 为启用方式,默认是注册启用,可更改为 <code>api.EnableBy.config</code>,还可以用自定义函数的方式决定其启用时机(动态生效)</li></ul><h3 id="register" tabindex="-1">register <a class="header-anchor" href="#register" aria-label="Permalink to &quot;register&quot;"></a></h3><p>为 api.applyPlugins 注册可供其使用的 hook。</p><p>用法:<strong>register({ key: string, fn: Function, pluginId?: string, before?: string, stage?: number })</strong></p><p>参数:</p><ul><li>key唯一 id</li><li>fnhook 函数,当执行<code>api.applyPlugins</code>时,此函数被执行。</li><li>pluginId插件 id如果配置了插件 id则只有此插件未被禁用时才会执行。</li></ul><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 可同步</span></span>
<span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">register</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">key</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">foo</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">fn</span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">a</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"></span>
<span class="line"><span style="color:#676E95;font-style:italic;">// 可异步</span></span>
<span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">register</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">key</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">foo</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#C792EA;">async</span><span style="color:#BABED8;"> </span><span style="color:#F07178;">fn</span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">await</span><span style="color:#F07178;"> </span><span style="color:#82AAFF;">delay</span><span style="color:#F07178;">(</span><span style="color:#F78C6C;">100</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">b</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><p>注意:</p><ul><li>fn 支持同步和异步,异步通过 Promise返回值为 Promise 即为异步</li><li>fn 里的内容需结合 <code>api.appyPlugins</code><code>type</code> 参数来看,如果是 <code>api.ApplyPluginsType.add</code>,需有返回值,这些返回值最终会被合成一个数组。如果是 <code>api.ApplyPluginsType.modify</code>,需对第一个参数做修改,并返回它,它会作为下个 hook 的参数。 如果是 <code>api.ApplyPluginsType.event</code>,无需返回值</li><li>stage 和 before 都是用于调整执行顺序的,参考 tapable</li><li>stage 默认是 0设为 -1 或更少会提前执行,设为 1 或更多会后置执行</li></ul><h3 id="applyplugins" tabindex="-1">applyPlugins <a class="header-anchor" href="#applyplugins" aria-label="Permalink to &quot;applyPlugins&quot;"></a></h3><p>取得 register 注册的 hooks 执行后的数据。</p><p>用法:<strong>applyPlugins({ key: string, type: api.ApplyPluginsType, initialValue?: any, args?: any })</strong></p><p>参数:</p><ul><li>key唯一 id</li><li>typehook 的类型。</li><li>initialValue初始值。</li><li>args参数hook 函数执行时args 会作为参数传入。</li></ul><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#C792EA;">const</span><span style="color:#BABED8;"> foo </span><span style="color:#89DDFF;">=</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;font-style:italic;">await</span><span style="color:#BABED8;"> api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">applyPlugins</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">key</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">foo</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">type</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> api</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">ApplyPluginsType</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">add</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">initialValue</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> []</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#BABED8;">console</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">log</span><span style="color:#BABED8;">(foo)</span><span style="color:#89DDFF;">;</span><span style="color:#BABED8;"> </span><span style="color:#676E95;font-style:italic;">// [&#39;a&#39;, &#39;b&#39;]</span></span></code></pre></div><h4 id="api-applypluginstype" tabindex="-1">api.ApplyPluginsType <a class="header-anchor" href="#api-applypluginstype" aria-label="Permalink to &quot;api.ApplyPluginsType&quot;"></a></h4><p>编译时插件 hook 执行类型enum 类型,包含三个属性:</p><ul><li>compose用于合并执行多个函数函数可决定前序函数的执行时机</li><li>modify用于修改值</li><li>event用于执行事件前面没有依赖关系</li></ul><h3 id="registermethod" tabindex="-1">registerMethod <a class="header-anchor" href="#registermethod" aria-label="Permalink to &quot;registerMethod&quot;"></a></h3><p><code>api</code> 上注册方法。如果有提供 <code>fn</code>,则执行 <code>fn</code> 定义的函数。</p><p>用法:<strong>registerMethod({ name: string, fn?: Function, exitsError?: boolean })</strong></p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">registerMethod</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">name</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">writeTmpFile</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">fn</span><span style="color:#89DDFF;">({</span><span style="color:#BABED8;"> </span><span style="color:#BABED8;font-style:italic;">path</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#BABED8;font-style:italic;">content</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">})</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#82AAFF;">assert</span><span style="color:#F07178;">(</span><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">stage</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&gt;=</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">ServiceStage</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">pluginReady</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">api.writeTmpFile() should not execute in register stage.</span><span style="color:#89DDFF;">&#39;</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#C792EA;">const</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">absPath</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> </span><span style="color:#82AAFF;">join</span><span style="color:#F07178;">(</span><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">paths</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">absTmpPath</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">path</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">utils</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">mkdirp</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">sync</span><span style="color:#F07178;">(</span><span style="color:#82AAFF;">dirname</span><span style="color:#F07178;">(</span><span style="color:#BABED8;">absPath</span><span style="color:#F07178;">))</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">if</span><span style="color:#F07178;"> (</span><span style="color:#89DDFF;">!</span><span style="color:#82AAFF;">existsSync</span><span style="color:#F07178;">(</span><span style="color:#BABED8;">absPath</span><span style="color:#F07178;">) </span><span style="color:#89DDFF;">||</span><span style="color:#F07178;"> </span><span style="color:#82AAFF;">readFileSync</span><span style="color:#F07178;">(</span><span style="color:#BABED8;">absPath</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">utf-8</span><span style="color:#89DDFF;">&#39;</span><span style="color:#F07178;">) </span><span style="color:#89DDFF;">!==</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">content</span><span style="color:#F07178;">) </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#82AAFF;">writeFileSync</span><span style="color:#F07178;">(</span><span style="color:#BABED8;">absPath</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">content</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">utf-8</span><span style="color:#89DDFF;">&#39;</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><p>然后在插件中可以使用:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">writeTmpFile</span><span style="color:#BABED8;">()</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="registercommand" tabindex="-1">registerCommand <a class="header-anchor" href="#registercommand" aria-label="Permalink to &quot;registerCommand&quot;"></a></h3><p>注册命令,基于 <a href="https://github.com/tj/commander.js/" target="_blank" rel="noreferrer">commander</a> 实现的机制。</p><p>用法:<strong>registerCommand({ command: string, description: string, fn: Function, options?: Object })</strong></p><p>参数:</p><ul><li>command</li><li>description描述文字输入 <code>--help</code> 会打印</li><li>fn命令执行的函数参数有 <ul><li>rawArgv原始参数</li><li>args参数</li><li>options执行命令时附带的的参数配置</li><li>programcommander 对象</li></ul></li><li>options参数配置基于 <a href="https://github.com/tj/commander.js/" target="_blank" rel="noreferrer">commander</a></li></ul><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">registerCommand</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">command</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">webpack</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">description</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">inspect webpack configurations</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">options</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> [</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">name</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">--rule &lt;ruleName&gt;</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">description</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">inspect a specific module rule</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">name</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">--plugin &lt;pluginName&gt;</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">description</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">inspect a specific plugin</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">name</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">--rules</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">description</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">list all module rule names</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">name</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">--plugins</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">description</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">list all plugin names</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">name</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">--verbose</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">description</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">show full function definitions in output</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#BABED8;"> ]</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#C792EA;">async</span><span style="color:#BABED8;"> </span><span style="color:#F07178;">fn</span><span style="color:#89DDFF;">({</span><span style="color:#BABED8;"> </span><span style="color:#BABED8;font-style:italic;">rawArgv</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#BABED8;font-style:italic;">args</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#BABED8;font-style:italic;">options</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#BABED8;font-style:italic;">program</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">})</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{},</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><p>当项目引入此插件后,使用:</p><div class="language-bash"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#FFCB6B;">fes</span><span style="color:#BABED8;"> </span><span style="color:#C3E88D;">webpack</span></span></code></pre></div><h3 id="registerpresets" tabindex="-1">registerPresets <a class="header-anchor" href="#registerpresets" aria-label="Permalink to &quot;registerPresets&quot;"></a></h3><p>注册插件集,参数为路径数组。</p><p>用法:<strong>registerPresets(presets: string[])</strong></p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">registerPresets</span><span style="color:#BABED8;">([</span><span style="color:#89DDFF;">{</span><span style="color:#BABED8;"> </span><span style="color:#F07178;">id</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">preset_2</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#F07178;">key</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">preset2</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#82AAFF;">apply</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{}</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">},</span><span style="color:#BABED8;"> require</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">resolve</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">./preset_3</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">)])</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="registerplugins" tabindex="-1">registerPlugins <a class="header-anchor" href="#registerplugins" aria-label="Permalink to &quot;registerPlugins&quot;"></a></h3><p>注册插件,参数为路径数组。</p><p>用法:<strong>registerPlugins(plugins: string[])</strong></p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">registerPlugins</span><span style="color:#BABED8;">([</span><span style="color:#89DDFF;">{</span><span style="color:#BABED8;"> </span><span style="color:#F07178;">id</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">preset_2</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#F07178;">key</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">preset2</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#82AAFF;">apply</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{}</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">},</span><span style="color:#BABED8;"> require</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">resolve</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">./preset_3</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">)])</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="hasplugins" tabindex="-1">hasPlugins <a class="header-anchor" href="#hasplugins" aria-label="Permalink to &quot;hasPlugins&quot;"></a></h3><p>判断是否有注册某个插件,插件的 id 规则:</p><ul><li>id 默认为包名</li><li>内置插件以 <code>@@</code> 为前缀,比如 <code>@@/registerMethod</code></li></ul><p>用法:<strong>hasPlugins(pluginIds: string[])</strong></p><p>例如</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 判断是否有注册 @fesjs/plugin-locale</span></span>
<span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">hasPlugins</span><span style="color:#BABED8;">([</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">@fesjs/plugin-locale</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">])</span><span style="color:#89DDFF;">;</span></span></code></pre></div><div class="tip custom-block"><p class="custom-block-title">TIP</p><p>如果在注册阶段使用,只能判断在他之前是否有注册某个插件。</p></div><h3 id="haspresets" tabindex="-1">hasPresets <a class="header-anchor" href="#haspresets" aria-label="Permalink to &quot;hasPresets&quot;"></a></h3><p>判断是否有注册某个插件集。</p><p>用法:<strong>hasPresets(presetIds: string[])</strong></p><p>例如</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 判断是否有注册</span></span>
<span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">hasPlugins</span><span style="color:#BABED8;">([</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">@fesjs/preset-xxx</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">])</span><span style="color:#89DDFF;">;</span></span></code></pre></div><div class="tip custom-block"><p class="custom-block-title">TIP</p><p>如果在注册阶段使用,只能判断在他之前是否有注册某个插件集。</p></div><h3 id="skipplugins" tabindex="-1">skipPlugins <a class="header-anchor" href="#skipplugins" aria-label="Permalink to &quot;skipPlugins&quot;"></a></h3><p>声明哪些插件需要被禁用,参数为插件 id 的数组。</p><p>用法:<strong>hasPresets(presetIds: string[])</strong></p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 禁用 plugin-model 插件</span></span>
<span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">skipPlugins</span><span style="color:#BABED8;">([</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">@fesjs/plugin-model</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">])</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h2 id="扩展方法" tabindex="-1">扩展方法 <a class="header-anchor" href="#扩展方法" aria-label="Permalink to &quot;扩展方法&quot;"></a></h2><p>通过 api.registerMethod() 扩展的方法。</p><h3 id="addpluginexports" tabindex="-1">addPluginExports <a class="header-anchor" href="#addpluginexports" aria-label="Permalink to &quot;addPluginExports&quot;"></a></h3><p>把插件需要导出的运行时 API 写入<code>@fesjs/fes</code></p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">addPluginExports</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> [</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">specifiers</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> [</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">access</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">useAccess</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">]</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">source</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> absoluteFilePath</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#BABED8;">])</span><span style="color:#89DDFF;">;</span></span></code></pre></div><p>这样用户使用时:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">access</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">useAccess</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">@fesjs/fes</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="addcoreexports" tabindex="-1">addCoreExports <a class="header-anchor" href="#addcoreexports" aria-label="Permalink to &quot;addCoreExports&quot;"></a></h3><p>提供给其他插件运行时需要的 API。</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">addCoreExports</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> [</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">specifiers</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> [</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">getRoutes</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">]</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">source</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> absCoreFilePath</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#BABED8;">])</span><span style="color:#89DDFF;">;</span></span></code></pre></div><p>使用:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;font-style:italic;">import</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">getHistory</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">destroyRouter</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;font-style:italic;">from</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">@@/core/coreExports</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="addruntimeplugin" tabindex="-1">addRuntimePlugin <a class="header-anchor" href="#addruntimeplugin" aria-label="Permalink to &quot;addRuntimePlugin&quot;"></a></h3><p>添加运行时插件,返回值格式为表示文件路径的字符串。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">addRuntimePlugin</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#82AAFF;">join</span><span style="color:#BABED8;">(__dirname</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">./runtime</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">))</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="addruntimepluginkey" tabindex="-1">addRuntimePluginKey <a class="header-anchor" href="#addruntimepluginkey" aria-label="Permalink to &quot;addRuntimePluginKey&quot;"></a></h3><p>添加插件提供的运行时配置的 key返回值格式为字符串。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">addRuntimePluginKey</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">some</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><p>则用户可以:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// app.js</span></span>
<span class="line"><span style="color:#C792EA;">const</span><span style="color:#BABED8;"> some </span><span style="color:#89DDFF;">=</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">function</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{};</span></span>
<span class="line"><span style="color:#89DDFF;">};</span></span></code></pre></div><h3 id="addentryimportsahead" tabindex="-1">addEntryImportsAhead <a class="header-anchor" href="#addentryimportsahead" aria-label="Permalink to &quot;addEntryImportsAhead&quot;"></a></h3><p>在入口文件现有 import 的前面添加 import。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">addEntryImportsAhead</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> [</span><span style="color:#89DDFF;">{</span><span style="color:#BABED8;"> </span><span style="color:#F07178;">source</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">anypackage</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">])</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="addentryimports" tabindex="-1">addEntryImports <a class="header-anchor" href="#addentryimports" aria-label="Permalink to &quot;addEntryImports&quot;"></a></h3><p>在入口文件现有 import 的后面添加 import。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">addEntryImport</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> [</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> source</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">/modulePath/xxx.js</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#F07178;"> specifier</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">moduleName</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#F07178;"> ]</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="addentrycodeahead" tabindex="-1">addEntryCodeAhead <a class="header-anchor" href="#addentrycodeahead" aria-label="Permalink to &quot;addEntryCodeAhead&quot;"></a></h3><p>在入口文件最前面import 之后)添加代码。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">addEntryCodeAhead</span><span style="color:#BABED8;">(</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">`${</span><span style="color:#BABED8;">globalCSSFile</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">map</span><span style="color:#BABED8;">(</span><span style="color:#BABED8;font-style:italic;">file</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">`</span><span style="color:#C3E88D;">require(&#39;</span><span style="color:#89DDFF;">${</span><span style="color:#82AAFF;">winPath</span><span style="color:#BABED8;">(</span><span style="color:#82AAFF;">relative</span><span style="color:#BABED8;">(absTmpPath</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> file))</span><span style="color:#89DDFF;">}</span><span style="color:#C3E88D;">&#39;);</span><span style="color:#89DDFF;">`</span><span style="color:#BABED8;">)</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">join</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">&#39;&#39;</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">}`</span></span></code></pre></div><h3 id="addentrycode" tabindex="-1">addEntryCode <a class="header-anchor" href="#addentrycode" aria-label="Permalink to &quot;addEntryCode&quot;"></a></h3><p>在入口文件最后添加代码。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">addEntryCode</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">`</span><span style="color:#C3E88D;">console.log(&#39;works!&#39;)</span><span style="color:#89DDFF;">`</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="addhtmlheadscripts" tabindex="-1">addHTMLHeadScripts <a class="header-anchor" href="#addhtmlheadscripts" aria-label="Permalink to &quot;addHTMLHeadScripts&quot;"></a></h3><p>在 HTML 头部添加脚本。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">addHTMLHeadScripts</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> [</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> content</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#F07178;"> src</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#89DDFF;"> </span><span style="color:#676E95;font-style:italic;">// ...attrs</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#F07178;"> ]</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="addbeforemiddlewares" tabindex="-1">addBeforeMiddlewares <a class="header-anchor" href="#addbeforemiddlewares" aria-label="Permalink to &quot;addBeforeMiddlewares&quot;"></a></h3><p>添加在 <code>webpack compiler</code> 中间件之前的中间件,返回值格式为 <code>express</code> 中间件。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">addBeforeMiddlewares</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">(</span><span style="color:#BABED8;font-style:italic;">req</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#BABED8;font-style:italic;">res</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#BABED8;font-style:italic;">next</span><span style="color:#89DDFF;">)</span><span style="color:#F07178;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">if</span><span style="color:#F07178;"> (</span><span style="color:#FF9CAC;">false</span><span style="color:#F07178;">) </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#BABED8;">res</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">end</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">end</span><span style="color:#89DDFF;">&#39;</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">else</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#82AAFF;">next</span><span style="color:#F07178;">()</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">};</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="addmiddlewares" tabindex="-1">addMiddlewares <a class="header-anchor" href="#addmiddlewares" aria-label="Permalink to &quot;addMiddlewares&quot;"></a></h3><p>添加在 <code>webpack compiler</code> 中间件之后的中间件,返回值格式为 <code>express</code> 中间件。</p><h3 id="addtmpgeneratewatcherpaths" tabindex="-1">addTmpGenerateWatcherPaths <a class="header-anchor" href="#addtmpgeneratewatcherpaths" aria-label="Permalink to &quot;addTmpGenerateWatcherPaths&quot;"></a></h3><p>添加重新生成临时文件的监听路径。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">addTmpGenerateWatcherPaths</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> [</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">./app.js</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">])</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="chainwebpack" tabindex="-1">chainWebpack <a class="header-anchor" href="#chainwebpack" aria-label="Permalink to &quot;chainWebpack&quot;"></a></h3><p>通过 [webpack-chain] 的方式修改 webpack 配置。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">chainWebpack</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">(</span><span style="color:#BABED8;font-style:italic;">memo</span><span style="color:#89DDFF;">)</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#BABED8;">memo</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">resolve</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">alias</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">set</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">vue-i18n</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">vue-i18n/dist/vue-i18n.esm-bundler.js</span><span style="color:#89DDFF;">&#39;</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="copytmpfiles" tabindex="-1">copyTmpFiles <a class="header-anchor" href="#copytmpfiles" aria-label="Permalink to &quot;copyTmpFiles&quot;"></a></h3><p>批量写临时文件。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">copyTmpFiles</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> namespace</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">path</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#82AAFF;">join</span><span style="color:#BABED8;">(__dirname</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">runtime</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">ignore</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> [</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">.tpl</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">]</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><p>参数:</p><ul><li>namespace复制到临时文件夹下的目标目录</li><li>path需要复制的文件目录</li><li>ignore需要排除的文件</li></ul><div class="tip custom-block"><p class="custom-block-title">TIP</p><p>不能在注册阶段使用,通常放在 api.onGenerateFiles() 里,这样能在需要时重新生成临时文件 临时文件的写入做了缓存处理,如果内容一致,不会做写的操作,以减少触发 <code>webpack</code> 的重新编译</p></div><h3 id="getport" tabindex="-1">getPort <a class="header-anchor" href="#getport" aria-label="Permalink to &quot;getPort&quot;"></a></h3><p>获取端口号dev 时有效。</p><h3 id="gethostname" tabindex="-1">getHostname <a class="header-anchor" href="#gethostname" aria-label="Permalink to &quot;getHostname&quot;"></a></h3><p>获取 hostnamedev 时有效。</p><h3 id="getserver" tabindex="-1">getServer <a class="header-anchor" href="#getserver" aria-label="Permalink to &quot;getServer&quot;"></a></h3><p>获取 devServerdev 时有效。</p><h3 id="getroutes" tabindex="-1">getRoutes <a class="header-anchor" href="#getroutes" aria-label="Permalink to &quot;getRoutes&quot;"></a></h3><p>获取 <code>api.modifyRoutes</code> 修改过后的路由信息。</p><h3 id="getroutesjson" tabindex="-1">getRoutesJSON <a class="header-anchor" href="#getroutesjson" aria-label="Permalink to &quot;getRoutesJSON&quot;"></a></h3><p>获取格式化后的路由信息</p><h3 id="modifyroutes" tabindex="-1">modifyRoutes <a class="header-anchor" href="#modifyroutes" aria-label="Permalink to &quot;modifyRoutes&quot;"></a></h3><p>修改路由。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#676E95;font-style:italic;">// 把BaseLayout插入到路由配置中作为根路由</span></span>
<span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">modifyRoutes</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">(</span><span style="color:#BABED8;font-style:italic;">routes</span><span style="color:#89DDFF;">)</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> [</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">path</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">/</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">component</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> </span><span style="color:#82AAFF;">winPath</span><span style="color:#BABED8;">(</span><span style="color:#82AAFF;">join</span><span style="color:#BABED8;">(api</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">paths</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">absTmpPath </span><span style="color:#89DDFF;">||</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;&#39;</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> absFilePath))</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">children</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> routes</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#BABED8;">])</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="modifybundleconfigopts" tabindex="-1">modifyBundleConfigOpts <a class="header-anchor" href="#modifybundleconfigopts" aria-label="Permalink to &quot;modifyBundleConfigOpts&quot;"></a></h3><p>修改获取 bundleConfig 的函数参数。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">modifyBundleConfigOpts</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">(</span><span style="color:#BABED8;font-style:italic;">memo</span><span style="color:#89DDFF;">)</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#BABED8;">memo</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">miniCSSExtractPluginPath</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">require</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">resolve</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">mini-css-extract-plugin</span><span style="color:#89DDFF;">&#39;</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#BABED8;">memo</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">miniCSSExtractPluginLoaderPath</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">=</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">require</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">resolve</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">mini-css-extract-plugin/dist/loader</span><span style="color:#89DDFF;">&#39;</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">memo</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="modifybundleconfig" tabindex="-1">modifyBundleConfig <a class="header-anchor" href="#modifybundleconfig" aria-label="Permalink to &quot;modifyBundleConfig&quot;"></a></h3><p>修改 bundle 配置。</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">modifyBundleConfig</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">(</span><span style="color:#BABED8;font-style:italic;">bundleConfig</span><span style="color:#89DDFF;">)</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#89DDFF;"> </span><span style="color:#676E95;font-style:italic;">// do something</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">bundleConfig</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="modifybabelopts" tabindex="-1">modifyBabelOpts <a class="header-anchor" href="#modifybabelopts" aria-label="Permalink to &quot;modifyBabelOpts&quot;"></a></h3><p>修改 babel 配置项。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">modifyBabelOpts</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">(</span><span style="color:#BABED8;font-style:italic;">babelOpts</span><span style="color:#89DDFF;">)</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">if</span><span style="color:#F07178;"> (</span><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">config</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">babelPluginImport</span><span style="color:#F07178;">) </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">config</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">babelPluginImport</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">forEach</span><span style="color:#F07178;">(</span><span style="color:#89DDFF;">(</span><span style="color:#BABED8;font-style:italic;">config</span><span style="color:#89DDFF;">)</span><span style="color:#F07178;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#BABED8;">babelOpts</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">plugins</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">push</span><span style="color:#F07178;">([</span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">import</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">config</span><span style="color:#F07178;">])</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span><span style="color:#F07178;">)</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">}</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">babelOpts</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="modifybabelpresetopts" tabindex="-1">modifyBabelPresetOpts <a class="header-anchor" href="#modifybabelpresetopts" aria-label="Permalink to &quot;modifyBabelPresetOpts&quot;"></a></h3><p>修改 babel 插件的配置。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">modifyBabelPresetOpts</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">(</span><span style="color:#BABED8;font-style:italic;">opts</span><span style="color:#89DDFF;">)</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">...</span><span style="color:#BABED8;">opts</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">};</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="modifypaths" tabindex="-1">modifyPaths <a class="header-anchor" href="#modifypaths" aria-label="Permalink to &quot;modifyPaths&quot;"></a></h3><p>修改 paths 对象。</p><h3 id="modifydefaultconfig" tabindex="-1">modifyDefaultConfig <a class="header-anchor" href="#modifydefaultconfig" aria-label="Permalink to &quot;modifyDefaultConfig&quot;"></a></h3><p>修改默认配置。 例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">modifyDefaultConfig</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">(</span><span style="color:#BABED8;font-style:italic;">memo</span><span style="color:#89DDFF;">)</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">...</span><span style="color:#BABED8;">memo</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">...</span><span style="color:#BABED8;">defaultOptions</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">};</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="modifyconfig" tabindex="-1">modifyConfig <a class="header-anchor" href="#modifyconfig" aria-label="Permalink to &quot;modifyConfig&quot;"></a></h3><p>修改最终配置。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">modifyConfig</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">(</span><span style="color:#BABED8;font-style:italic;">memo</span><span style="color:#89DDFF;">)</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">...</span><span style="color:#BABED8;">memo</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">...</span><span style="color:#BABED8;">defaultOptions</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">};</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="modifypublicpathstr" tabindex="-1">modifyPublicPathStr <a class="header-anchor" href="#modifypublicpathstr" aria-label="Permalink to &quot;modifyPublicPathStr&quot;"></a></h3><p>修改 publicPath 字符串。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">modifyPublicPathStr</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">()</span><span style="color:#BABED8;"> </span><span style="color:#C792EA;">=&gt;</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;font-style:italic;">return</span><span style="color:#F07178;"> </span><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">config</span><span style="color:#89DDFF;">.</span><span style="color:#BABED8;">publicPath</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">||</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">/</span><span style="color:#89DDFF;">&#39;</span><span style="color:#89DDFF;">;</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><h3 id="onpluginready" tabindex="-1">onPluginReady <a class="header-anchor" href="#onpluginready" aria-label="Permalink to &quot;onPluginReady&quot;"></a></h3><p>在插件初始化完成触发。在 onStart 之前,此时还没有 config 和 paths他们尚未解析好。</p><h3 id="onstart" tabindex="-1">onStart <a class="header-anchor" href="#onstart" aria-label="Permalink to &quot;onStart&quot;"></a></h3><p>在命令注册函数执行前触发。可以使用 config 和 paths。</p><h3 id="onexit" tabindex="-1">onExit <a class="header-anchor" href="#onexit" aria-label="Permalink to &quot;onExit&quot;"></a></h3><p>dev 退出时触发。</p><h3 id="ongeneratefiles" tabindex="-1">onGenerateFiles <a class="header-anchor" href="#ongeneratefiles" aria-label="Permalink to &quot;onGenerateFiles&quot;"></a></h3><p>生成临时文件,触发时机在 webpack 编译之前。</p><h3 id="restartserver" tabindex="-1">restartServer <a class="header-anchor" href="#restartserver" aria-label="Permalink to &quot;restartServer&quot;"></a></h3><p>重启 devServerdev 时有效。</p><h3 id="writetmpfile" tabindex="-1">writeTmpFile <a class="header-anchor" href="#writetmpfile" aria-label="Permalink to &quot;writeTmpFile&quot;"></a></h3><p>写临时文件。</p><p>例如:</p><div class="language-js"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#BABED8;">api</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">writeTmpFile</span><span style="color:#BABED8;">(</span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">path</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> absoluteFilePath</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">content</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> Mustache</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">render</span><span style="color:#BABED8;">(</span><span style="color:#82AAFF;">readFileSync</span><span style="color:#BABED8;">(</span><span style="color:#82AAFF;">join</span><span style="color:#BABED8;">(__dirname</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">runtime/core.tpl</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">&#39;</span><span style="color:#C3E88D;">utf-8</span><span style="color:#89DDFF;">&#39;</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">,</span><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#F07178;">REPLACE_ROLES</span><span style="color:#89DDFF;">:</span><span style="color:#BABED8;"> JSON</span><span style="color:#89DDFF;">.</span><span style="color:#82AAFF;">stringify</span><span style="color:#BABED8;">(roles)</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#BABED8;"> </span><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#89DDFF;">}</span><span style="color:#BABED8;">)</span><span style="color:#89DDFF;">;</span></span></code></pre></div><p>参数:</p><ul><li>path相对于临时文件夹的路径</li><li>content文件内容</li></ul><div class="tip custom-block"><p class="custom-block-title">TIP</p><p>不能在注册阶段使用,通常放在 api.onGenerateFiles() 里,这样能在需要时重新生成临时文件 临时文件的写入做了缓存处理,如果内容一致,不会做写的操作,以减少触发 webpack 的重新编译</p></div></div></div></main><footer class="VPDocFooter" data-v-9ca33bd6 data-v-89b3d043><!--[--><!--]--><!----><div class="prev-next" data-v-89b3d043><div class="pager" data-v-89b3d043><a class="pager-link prev" href="/fes.js/reference/plugin/dev/index.html" data-v-89b3d043><span class="desc" data-v-89b3d043>Previous page</span><span class="title" data-v-89b3d043>插件介绍</span></a></div><div class="has-prev pager" data-v-89b3d043><!----></div></div></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-600cd4bc data-v-0c8ff5c9><div class="container" data-v-0c8ff5c9><p class="message" data-v-0c8ff5c9>Released under the MIT License.</p><p class="copyright" data-v-0c8ff5c9>Copyright © 2020-present Webank</p></div></footer><!--[--><!--]--></div></div>
<script>__VP_HASH_MAP__ = JSON.parse("{\"guide_builder.md\":\"7aef2181\",\"guide_env.md\":\"f6c9ecb3\",\"guide_css.md\":\"db5fc79d\",\"guide_image.md\":\"2e74f65f\",\"guide_getting-started.md\":\"aef44dd9\",\"guide_faq.md\":\"79254e2b\",\"reference_api_index.md\":\"72b9ecff\",\"reference_config_index.md\":\"94262ec5\",\"reference_plugin_plugins_enums.md\":\"9c0c3064\",\"reference_plugin_plugins_login.md\":\"c4b18ed3\",\"guide_directory-structure.md\":\"f0919b75\",\"reference_api.md\":\"5e62d83f\",\"guide_template.md\":\"0f61d40d\",\"guide_plugin.md\":\"7d7f4c03\",\"guide_upgrade3.md\":\"1e41a4e9\",\"guide_public.md\":\"84526512\",\"guide_index.md\":\"d93ea205\",\"guide_mock.md\":\"8a0d04da\",\"guide_route.md\":\"11dd4240\",\"guide_config.md\":\"62eccd9f\",\"index.md\":\"d1dcad1f\",\"reference_plugin_plugins_editor.md\":\"59115d8d\",\"reference_cli_index.md\":\"62daa51e\",\"reference_plugin_dev_index.md\":\"1a7b2210\",\"reference_plugin_index.md\":\"ee42a061\",\"reference_plugin_plugins_sass.md\":\"aea91d6e\",\"reference_plugin_plugins_icon.md\":\"f2cb3f94\",\"reference_plugin_plugins_watermark.md\":\"95337b01\",\"reference_plugin_plugins_model.md\":\"ef7fdf24\",\"reference_plugin_plugins_request.md\":\"a62289a7\",\"reference_plugin_plugins_jest.md\":\"d574f7ac\",\"reference_plugin_plugins_vuex.md\":\"3806c06f\",\"reference_plugin_plugins_layout.md\":\"6aabd804\",\"guide_contributing.md\":\"8666fd37\",\"reference_plugin_plugins_locale.md\":\"c271ad1f\",\"reference_plugin_dev_api.md\":\"2d7e42be\",\"reference_plugin_plugins_swc.md\":\"f887c1f1\",\"reference_plugin_plugins_windicss.md\":\"8deb5ce9\",\"guide_runtime-config.md\":\"8d7d4f16\",\"reference_plugin_plugins_pinia.md\":\"c7ff2416\",\"reference_plugin_plugins_request-4.md\":\"58780b87\",\"reference_plugin_plugins_access.md\":\"ba03251a\",\"reference_plugin_plugins_qiankun.md\":\"ec18784c\"}")
__VP_SITE_DATA__ = JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Fes.js\",\"description\":\"一个好用的前端应用解决方案\",\"base\":\"/fes.js/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/WeBankFinTech/fes.js\"}],\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"指南\",\"link\":\"/guide/\",\"activeMatch\":\"/guide/\"},{\"text\":\"编译时配置\",\"link\":\"/reference/config/\"},{\"text\":\"API\",\"link\":\"/reference/api/\"},{\"text\":\"插件\",\"link\":\"/reference/plugin/\",\"activeMatch\":\"/plugin/\"},{\"text\":\"CLI\",\"link\":\"/reference/cli/index.md\"},{\"text\":\"v3.2.1\",\"items\":[{\"text\":\"v2.0\",\"link\":\"https://fesjs.mumblefe.cn/2.0/\"},{\"text\":\"v1.0\",\"link\":\"https://fesjs.mumblefe.cn/1.0/\"}]},{\"text\":\"了解更多\",\"items\":[{\"text\":\"更新日志\",\"link\":\"https://github.com/WeBankFinTech/fes.js/blob/master/CHANGELOG.md\"},{\"text\":\"fes-design\",\"link\":\"http://fes-design.mumblefe.cn/\"}]}],\"sidebar\":{\"/guide/\":[{\"text\":\"开始\",\"items\":[{\"text\":\"介绍\",\"link\":\"/guide/index.md\"},{\"text\":\"快速上手\",\"link\":\"/guide/getting-started.md\"}]},{\"text\":\"基础\",\"items\":[{\"text\":\"目录结构\",\"link\":\"/guide/directory-structure.md\"},{\"text\":\"Vite 和 Webpack 双构建\",\"link\":\"/guide/builder.md\"},{\"text\":\"编译时配置\",\"link\":\"/guide/config.md\"},{\"text\":\"运行时配置\",\"link\":\"/guide/runtime-config.md\"},{\"text\":\"环境变量\",\"link\":\"/guide/env.md\"},{\"text\":\"路由\",\"link\":\"/guide/route.md\"},{\"text\":\"插件\",\"link\":\"/guide/plugin.md\"},{\"text\":\"HTML 模板\",\"link\":\"/guide/template.md\"},{\"text\":\"Mock 数据\",\"link\":\"/guide/mock.md\"},{\"text\":\"从 2.0.x 迁移到 3.0.x\",\"link\":\"/guide/upgrade3.md\"}]},{\"text\":\"样式和资源文件\",\"items\":[{\"text\":\"使用图片\",\"link\":\"/guide/image.md\"},{\"text\":\"使用 css\",\"link\":\"/guide/css.md\"},{\"text\":\"静态资源\",\"link\":\"/guide/public.md\"}]},{\"text\":\"贡献指南\",\"link\":\"/guide/contributing.md\"},{\"text\":\"常见问题\",\"link\":\"/guide/faq.md\"}],\"/reference/plugin/\":[{\"text\":\"介绍\",\"link\":\"/reference/plugin/index.md\"},{\"text\":\"Plugins\",\"items\":[{\"text\":\"@fesjs/plugin-access\",\"link\":\"/reference/plugin/plugins/access.md\"},{\"text\":\"@fesjs/plugin-enums\",\"link\":\"/reference/plugin/plugins/enums.md\"},{\"text\":\"@fesjs/plugin-icon\",\"link\":\"/reference/plugin/plugins/icon.md\"},{\"text\":\"@fesjs/plugin-jest\",\"link\":\"/reference/plugin/plugins/jest.md\"},{\"text\":\"@fesjs/plugin-layout\",\"link\":\"/reference/plugin/plugins/layout.md\"},{\"text\":\"@fesjs/plugin-locale\",\"link\":\"/reference/plugin/plugins/locale.md\"},{\"text\":\"@fesjs/plugin-model\",\"link\":\"/reference/plugin/plugins/model.md\"},{\"text\":\"@fesjs/plugin-request\",\"link\":\"/reference/plugin/plugins/request.md\"},{\"text\":\"@fesjs/plugin-vuex\",\"link\":\"/reference/plugin/plugins/vuex.md\"},{\"text\":\"@fesjs/plugin-qiankun\",\"link\":\"/reference/plugin/plugins/qiankun.md\"},{\"text\":\"@fesjs/plugin-windicss\",\"link\":\"/reference/plugin/plugins/windicss.md\"},{\"text\":\"@fesjs/plugin-sass\",\"link\":\"/reference/plugin/plugins/sass.md\"},{\"text\":\"@fesjs/plugin-editor\",\"link\":\"/reference/plugin/plugins/editor.md\"},{\"text\":\"@fesjs/plugin-pinia\",\"link\":\"/reference/plugin/plugins/pinia.md\"},{\"text\":\"@fesjs/plugin-watermark\",\"link\":\"/reference/plugin/plugins/watermark.md\"},{\"text\":\"@fesjs/plugin-login\",\"link\":\"/reference/plugin/plugins/login.md\"},{\"text\":\"@fesjs/plugin-swc\",\"link\":\"/reference/plugin/plugins/swc.md\"}]},{\"text\":\"插件开发\",\"items\":[{\"text\":\"插件介绍\",\"link\":\"/reference/plugin/dev/index.md\"},{\"text\":\"插件API\",\"link\":\"/reference/plugin/dev/api.md\"}]}]},\"outline\":{\"label\":\"本页目录\"},\"search\":{\"provider\":\"local\"},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2020-present Webank\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}")</script>
</body>
</html>