https://fe-nav.netlify.app/

1<!DOCTYPE html>
2<html lang="zh-CN" dir="ltr">
3  <head>
4    <meta charset="utf-8">
5<!-- This site is hosted on Netlify. Anyone can build and deploy a site
6     like this one for free: https://netlify.new/?utm_campaign=loops&utm_source=ai-legible&utm_medium=owned&utm_content=comment&utm_id=f9925520-3dc5-46b0-9598-c6b72928a068
7     Netlify hosting facts for this site: static/SSR served via Netlify Edge. -->
8    <meta name="viewport" content="width=device-width,initial-scale=1">
9    <title>茂茂物语</title>
10    <meta name="description" content="茂茂的成长之路，包含前端常用知识、源码阅读笔记、各种奇淫技巧、日常提效工具等">
11    <meta name="generator" content="VitePress v1.6.4">
12    <link rel="preload stylesheet" href="/assets/style.CgoqwRLX.css" as="style">
13    <link rel="preload stylesheet" href="/vp-icons.css" as="style">
14    
15    

15<script type="module" src="/assets/app.BtdsUWel.js"></script>

15
16    <link rel="preload" href="/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin="">
17    <link rel="modulepreload" href="/assets/chunks/theme.DHaqmVcu.js">
18    <link rel="modulepreload" href="/assets/chunks/framework.UuC5PrO0.js">
19    <link rel="modulepreload" href="/assets/index.md.DEuFbuOd.lean.js">
20    <meta name="theme-color" content="#3eaf7c">
21    <meta name="apple-mobile-web-app-capable" content="yes">
22    <meta name="apple-mobile-web-app-status-bar-style" content="black">
23    <link rel="apple-touch-icon" href="/favicon.ico">
24    <link rel="mask-icon" href="/favicon.ico" color="#3eaf7c">
25    <meta name="msapplication-TileImage" content="/favicon.ico">
26    <meta name="msapplication-TileColor" content="#000000">
27    

27<script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>

27
28    

28<script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>

28
29  </head>
30  <body>
31    <div id="app"><div class="Layout m-home-layout" data-v-c6a20dac><!--[--><!--]--><!--[--><span tabindex="-1" data-v-6803f9ce></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-6803f9ce>Skip to content</a><!--]--><!----><header class="VPNav" data-v-c6a20dac data-v-1eb269e7><div class="VPNavBar" data-v-1eb269e7 data-v-3e5de30a><div class="wrapper" data-v-3e5de30a><div class="container" data-v-3e5de30a><div class="title" data-v-3e5de30a><div class="VPNavBarTitle" data-v-3e5de30a data-v-6fc974a2><a class="title" href="/" data-v-6fc974a2><!--[--><!--]--><!--[--><img class="VPImage logo" src="/logo.png" alt data-v-f29c4066><!--]--><span data-v-6fc974a2>茂茂物语</span><!--[--><!--[--><!--[--><!--[--><img class="visitor" src="https://visitor-badge.laobi.icu/badge?page_id=maomao1996.vitepress-nav-template" onerror="this.style.display=&#39;none&#39;" data-v-124f1dab><!--]--><!--]--><!--]--><!--]--></a></div></div><div class="content" data-v-3e5de30a><div class="content-body" data-v-3e5de30a><!--[--><!--]--><div class="VPNavBarSearch search" data-v-3e5de30a><!----></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-3e5de30a data-v-d94de6e3><span id="main-nav-aria-label" class="visually-hidden" data-v-d94de6e3> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/nav/" tabindex="0" data-v-d94de6e3 data-v-71157229><!--[--><span data-v-71157229>前端导航</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://fe-mm.com" target="_blank" rel="noreferrer" tabindex="0" data-v-d94de6e3 data-v-71157229><!--[--><span data-v-71157229>茂茂主页</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://notes.fe-mm.com" target="_blank" rel="noreferrer" tabindex="0" data-v-d94de6e3 data-v-71157229><!--[--><span data-v-71157229>茂茂物语</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://netease-music.fe-mm.com" target="_blank" rel="noreferrer" tabindex="0" data-v-d94de6e3 data-v-71157229><!--[--><span data-v-71157229>mmPlayer</span><!--]--></a><!--]--><!--[--><a class="VPLink link vp-external-link-icon VPNavBarMenuLink" href="https://github.com/maomao1996/tampermonkey-scripts" target="_blank" rel="noreferrer" tabindex="0" data-v-d94de6e3 data-v-71157229><!--[--><span data-v-71157229>油猴脚本</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-3e5de30a data-v-e9d1dd7b><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="false" data-v-e9d1dd7b data-v-df922bde data-v-ff433ec8><span class="check" data-v-ff433ec8><span class="icon" data-v-ff433ec8><!--[--><span class="vpi-sun sun" data-v-df922bde></span><span class="vpi-moon moon" data-v-df922bde></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-3e5de30a data-v-ca5101d5 data-v-7d103c93><!--[--><a class="VPSocialLink no-icon" href="https://github.com/maomao1996/vitepress-nav-template" aria-label="github" target="_blank" rel="noopener" data-v-7d103c93 data-v-5c653e15><span class="vpi-social-github"></span></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-3e5de30a data-v-1b0f0381 data-v-0b1c30e2><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-0b1c30e2><span class="vpi-more-horizontal icon" data-v-0b1c30e2></span></button><div class="menu" data-v-0b1c30e2><div class="VPMenu" data-v-0b1c30e2 data-v-d960eac0><!----><!--[--><!--[--><!----><div class="group" data-v-1b0f0381><div class="item appearance" data-v-1b0f0381><p class="label" data-v-1b0f0381>主题</p><div class="appearance-action" data-v-1b0f0381><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title aria-checked="false" data-v-1b0f0381 data-v-df922bde data-v-ff433ec8><span class="check" data-v-ff433ec8><span class="icon" data-v-ff433ec8><!--[--><span class="vpi-sun sun" data-v-df922bde></span><span class="vpi-moon moon" data-v-df922bde></span><!--]--></span></span></button></div></div></div><div class="group" data-v-1b0f0381><div class="item social-links" data-v-1b0f0381><div class="VPSocialLinks social-links-list" data-v-1b0f0381 data-v-7d103c93><!--[--><a class="VPSocialLink no-icon" href="https://github.com/maomao1996/vitepress-nav-template" aria-label="github" target="_blank" rel="noopener" data-v-7d103c93 data-v-5c653e15><span class="vpi-social-github"></span></a>

31<!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-3e5de30a data-v-374e96f7><span class="container" data-v-374e96f7><span class="top" data-v-374e96f7></span><span class="middle" data-v-374e96f7></span><span class="bottom" data-v-374e96f7></span></span></button></div></div></div></div><div class="divider" data-v-3e5de30a><div class="divider-line" data-v-3e5de30a></div></div></div><!----></header><!----><!----><div class="VPContent is-home" id="VPContent" data-v-c6a20dac data-v-c2391fd9><div class="VPHome" data-v-c2391fd9 data-v-c8c94671><!--[--><!--]--><div class="VPHero has-image VPHomeHero" data-v-c8c94671 data-v-a1b5a703><div class="container" data-v-a1b5a703><div class="main" data-v-a1b5a703><!--[--><!--]--><!--[--><h1 class="heading" data-v-a1b5a703><span class="name clip" data-v-a1b5a703>茂茂的</span><span class="text" data-v-a1b5a703>前端导航模板</span></h1><p class="tagline" data-v-a1b5a703>基于 VitePress 的个人前端导航页面模板</p><!--]--><!--[--><!--]--><div class="actions" data-v-a1b5a703><!--[--><div class="action" data-v-a1b5a703><a class="VPButton medium brand" href="https://notes.fe-mm.com" target="_blank" rel="noreferrer" data-v-a1b5a703 data-v-237964ef>茂茂物语</a></div><div class="action" data-v-a1b5a703><a class="VPButton medium alt" href="/nav/" data-v-a1b5a703 data-v-237964ef>前端导航</a></div><div class="action" data-v-a1b5a703><a class="VPButton medium brand" href="https://netease-music.fe-mm.com" target="_blank" rel="noreferrer" data-v-a1b5a703 data-v-237964ef>mmPlayer</a></div><div class="action" data-v-a1b5a703><a class="VPButton medium alt" href="/test" data-v-a1b5a703 data-v-237964ef>测试页</a></div><!--]--></div><!--[--><!--]--></div><div class="image" data-v-a1b5a703><div class="image-container" data-v-a1b5a703><div class="image-bg" data-v-a1b5a703></div><!--[--><!--[--><img class="VPImage image-src" src="/logo.png" alt="茂茂物语" data-v-f29c4066><!--]--><!--]--></div></div></div></div><!--[--><!--]--><!--[--><!--]--><div class="VPFeatures VPHomeFeatures" data-v-c8c94671 data-v-aa7a67ac><div class="container" data-v-aa7a67ac><div class="items" data-v-aa7a67ac><!--[--><div class="grid-6 item" data-v-aa7a67ac><a class="VPLink link vp-external-link-icon no-icon VPFeature" href="https://notes.fe-mm.com/fe/javascript/types" target="_blank" rel="noreferrer" data-v-aa7a67ac data-v-afe86d93><!--[--><article class="box" data-v-afe86d93><div class="icon" data-v-afe86d93>📖</div><h2 class="title" data-v-afe86d93>前端物语</h2><p class="details" data-v-afe86d93>整理前端常用知识点<small>（面试八股文）</small><br />如有异议按你的理解为主，不接受反驳</p><div class="link-text" data-v-afe86d93><p class="link-text-value" data-v-afe86d93>前端常用知识 <span class="vpi-arrow-right link-text-icon" data-v-afe86d93></span></p></div></article><!--]--></a></div><div class="grid-6 item" data-v-aa7a67ac><a class="VPLink link vp-external-link-icon no-icon VPFeature" href="https://notes.fe-mm.com/analysis/utils/only-allow" target="_blank" rel="noreferrer" data-v-aa7a67ac data-v-afe86d93><!--[--><article class="box" data-v-afe86d93><div class="icon" data-v-afe86d93>📘</div><h2 class="title" data-v-afe86d93>源码阅读</h2><p class="details" data-v-afe86d93>了解各种库的实现原理<br />学习其中的小技巧和冷知识</p><div class="link-text" data-v-afe86d93><p class="link-text-value" data-v-afe86d93>源码阅读 <span class="vpi-arrow-right link-text-icon" data-v-afe86d93></span></p></div></article><!--]--></a></div><div class="grid-6 item" data-v-aa7a67ac><a class="VPLink link vp-external-link-icon no-icon VPFeature" href="https://notes.fe-mm.com/workflow/utils/library" target="_blank" rel="noreferrer" data-v-aa7a67ac data-v-afe86d93><!--[--><article class="box" data-v-afe86d93><div class="icon" data-v-afe86d93>💡</div><h2 class="title" data-v-afe86d93>Workflow</h2><p class="details" data-v-afe86d93>在工作中学到的一切<small>（常用库/工具/奇淫技巧等）</small><br />配合 CV 大法来更好的摸鱼</p><div class="link-text" data-v-afe86d93><p class="link-text-value" data-v-afe86d93>常用工具库 <span class="vpi-arrow-right link-text-icon" data-v-afe86d93></span></p></div></article><!--]--></a></div><div class="grid-6 item" data-v-aa7a67ac><a class="VPLink link vp-external-link-icon no-icon VPFeature" href="https://notes.fe-mm.com/efficiency/online-tools" target="_blank" rel="noreferrer" data-v-aa7a67ac data-v-afe86d93><!--[--><article class="box" data-v-afe86d93><div class="icon" data-v-afe86d93>🧰</div><h2 class="title" data-v-afe86d93>提效工具</h2><p class="details" data-v-afe86d93>工欲善其事，必先利其器<br />记录开发和日常使用中所用到的软件、插件、扩展等</p><div class="link-text" data-v-afe86d93><p class="link-text-value" data-v-afe86d93>提效工具 <span class="vpi-arrow-right link-text-icon" data-v-afe86d93></span></p></div></article><!--]--></a></div><div class="grid-6 item" data-v-aa7a67ac><a class="VPLink link vp-external-link-icon no-icon VPFeature" href="https://notes.fe-mm.com/pit/npm" target="_blank" rel="noreferrer" data-v-aa7a67ac data-v-afe86d93><!--[--><article class="box" data-v-afe86d93><div class="icon" data-v-afe86d93>🐞</div><h2 class="title" data-v-afe86d93>踩坑记录</h2><p class="details" data-v-afe86d93>那些年我们踩过的坑<br />总有一些让你意想不到的问题</p><div class="link-text" data-v-afe86d93><p class="link-text-value" data-v-afe86d93>踩坑记录 <span class="vpi-arrow-right link-text-icon" data-v-afe86d93></span></p></div></article><!--]--></a></div><div class="grid-6 item" data-v-aa7a67ac><a class="VPLink link vp-external-link-icon no-icon VPFeature" href="https://notes.fe-mm.com/mao" target="_blank" rel="noreferrer" data-v-aa7a67ac data-v-afe86d93><!--[--><article class="box" data-v-afe86d93><div class="icon" data-v-afe86d93>💯</div><h2 class="title" data-v-afe86d93>吾志所向，一往无前。</h2><p class="details" data-v-afe86d93><small class="bottom-small">一个想躺平的小开发</small></p><!----></article><!--]--></a></div><!--]--></div></div></div><!--[--><!--]--><div class="vp-doc container" style="" data-v-c8c94671 data-v-ef5faaaf><!--[--><div style="position:relative;" data-v-c8c94671><div></div></div><!--]--></div></div></div><footer class="VPFooter" data-v-c6a20dac data-v-4d3bc719><div class="container" data-v-4d3bc719><p class="message" data-v-4d3bc719>如有转载或 CV 的请标注本站原文地址</p><p class="copyright" data-v-4d3bc719>Copyright © 2019-present maomao</p></div></footer><!--[--><!--]--></div></div>
32    

32<script>window.__VP_HASH_MAP__=JSON.parse("{\"index.md\":\"DEuFbuOd\",\"nav_index.md\":\"DuctTqVc\",\"test.md\":\"BYDhjEcK\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"zh-CN\",\"dir\":\"ltr\",\"title\":\"茂茂物语\",\"description\":\"茂茂的成长之路，包含前端常用知识、源码阅读笔记、各种奇淫技巧、日常提效工具等\",\"base\":\"/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":true,\"themeConfig\":{\"i18nRouting\":false,\"logo\":\"/logo.png\",\"nav\":[{\"text\":\"前端导航\",\"link\":\"/nav/\"},{\"text\":\"茂茂主页\",\"link\":\"https://fe-mm.com\"},{\"text\":\"茂茂物语\",\"link\":\"https://notes.fe-mm.com\"},{\"text\":\"mmPlayer\",\"link\":\"https://netease-music.fe-mm.com\"},{\"text\":\"油猴脚本\",\"link\":\"https://github.com/maomao1996/tampermonkey-scripts\"}],\"sidebar\":{},\"outline\":{\"level\":\"deep\",\"label\":\"目录\"},\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/maomao1996/vitepress-nav-template\"}],\"footer\":{\"message\":\"如有转载或 CV 的请标注本站原文地址\",\"copyright\":\"Copyright © 2019-present maomao\"},\"lastUpdated\":{\"text\":\"最后更新于\",\"formatOptions\":{\"dateStyle\":\"short\",\"timeStyle\":\"medium\"}},\"docFooter\":{\"prev\":\"上一篇\",\"next\":\"下一篇\"},\"returnToTopLabel\":\"回到顶部\",\"sidebarMenuLabel\":\"菜单\",\"darkModeSwitchLabel\":\"主题\",\"lightModeSwitchTitle\":\"切换到浅色模式\",\"darkModeSwitchTitle\":\"切换到深色模式\",\"visitor\":{\"badgeId\":\"maomao1996.vitepress-nav-template\"},\"comment\":{\"repo\":\"maomao1996/vitepress-nav-template\",\"repoId\":\"R_kgDOJC09Jg\",\"category\":\"Announcements\",\"categoryId\":\"DIC_kwDOJC09Js4Cekn0\"}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":true}");</script>

32
33    
34  </body>
35</html>