-
Notifications
You must be signed in to change notification settings - Fork 0
/
getting-started.html
80 lines (78 loc) · 56.6 KB
/
getting-started.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<!DOCTYPE html>
<html lang="zh-CN" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>快速上手 | Quan Chen</title>
<meta name="description" content="Quan Chen's blog">
<meta name="generator" content="VitePress v1.3.4">
<link rel="preload stylesheet" href="/mattchen-blog/assets/style.BCO2bTwi.css" as="style">
<script type="module" src="/mattchen-blog/assets/app.C7_Y9a3w.js"></script>
<link rel="preload" href="/mattchen-blog/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin="">
<link rel="modulepreload" href="/mattchen-blog/assets/chunks/theme.eGbm5nAR.js">
<link rel="modulepreload" href="/mattchen-blog/assets/chunks/framework.CyxoavMZ.js">
<link rel="modulepreload" href="/mattchen-blog/assets/getting-started.md.BEfG1NoJ.lean.js">
<link rel="icon" href="/logo.png">
<script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"dark",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
<script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
</head>
<body>
<div id="app"><div class="Layout" data-v-70d64d62><!--[--><!--]--><!--[--><span tabindex="-1" data-v-26cc5a6d></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-26cc5a6d> Skip to content </a><!--]--><!----><header class="VPNav" data-v-70d64d62 data-v-008c5c8f><div class="VPNavBar top" data-v-008c5c8f data-v-bbda3dac><div class="wrapper" data-v-bbda3dac><div class="container" data-v-bbda3dac><div class="title" data-v-bbda3dac><div class="VPNavBarTitle" data-v-bbda3dac data-v-0190d248><a class="title" href="/mattchen-blog/" data-v-0190d248><!--[--><!--]--><!--[--><img class="VPImage logo" src="/mattchen-blog/logo.png" alt data-v-5cc9c29c><!--]--><span data-v-0190d248>Quan Chen</span><!--[--><!--]--></a></div></div><div class="content" data-v-bbda3dac><div class="content-body" data-v-bbda3dac><!--[--><!--]--><div class="VPNavBarSearch search" data-v-bbda3dac><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><span class="vp-icon DocSearch-Search-Icon"></span><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-bbda3dac data-v-221b881b><span id="main-nav-aria-label" class="visually-hidden" data-v-221b881b> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/mattchen-blog/notes/" tabindex="0" data-v-221b881b data-v-416dc945><!--[--><span data-v-416dc945>DLNotes</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/mattchen-blog/math/" tabindex="0" data-v-221b881b data-v-416dc945><!--[--><span data-v-416dc945>Math</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/mattchen-blog/Programming/" tabindex="0" data-v-221b881b data-v-416dc945><!--[--><span data-v-416dc945>Programming</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/mattchen-blog/tools/" tabindex="0" data-v-221b881b data-v-416dc945><!--[--><span data-v-416dc945>Tools</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/mattchen-blog/about/" tabindex="0" data-v-221b881b data-v-416dc945><!--[--><span data-v-416dc945>About</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-bbda3dac data-v-0d3e83b4><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="Switch to light theme" aria-checked="true" data-v-0d3e83b4 data-v-1efe56b3 data-v-500272df><span class="check" data-v-500272df><span class="icon" data-v-500272df><!--[--><span class="vpi-sun sun" data-v-1efe56b3></span><span class="vpi-moon moon" data-v-1efe56b3></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-bbda3dac data-v-4ed29731 data-v-31ce25be><!--[--><a class="VPSocialLink no-icon" href="https://github.com/Yiov/vitepress-doc" aria-label="github" target="_blank" rel="noopener" data-v-31ce25be data-v-175b4e05><span class="vpi-social-github" /></a><a class="VPSocialLink no-icon" href="https://weixin.qq.com/" aria-label="wechat" target="_blank" rel="noopener" data-v-31ce25be data-v-175b4e05><svg t="1703483542872" class="icon" viewBox="0 0 1309 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6274" width="200" height="200"><path d="M1147.26896 912.681417l34.90165 111.318583-127.165111-66.823891a604.787313 604.787313 0 0 1-139.082747 22.263717c-220.607239 0-394.296969-144.615936-394.296969-322.758409s173.526026-322.889372 394.296969-322.889372C1124.219465 333.661082 1309.630388 478.669907 1309.630388 656.550454c0 100.284947-69.344929 189.143369-162.361428 256.130963zM788.070086 511.869037a49.11114 49.11114 0 0 0-46.360916 44.494692 48.783732 48.783732 0 0 0 46.360916 44.494693 52.090549 52.090549 0 0 0 57.983885-44.494693 52.385216 52.385216 0 0 0-57.983885-44.494692z m254.985036 0a48.881954 48.881954 0 0 0-46.09899 44.494692 48.620028 48.620028 0 0 0 46.09899 44.494693 52.385216 52.385216 0 0 0 57.983886-44.494693 52.58166 52.58166 0 0 0-57.951145-44.494692z m-550.568615 150.018161a318.567592 318.567592 0 0 0 14.307712 93.212943c-14.307712 1.080445-28.746387 1.768001-43.283284 1.768001a827.293516 827.293516 0 0 1-162.394168-22.296458l-162.001279 77.955749 46.328175-133.811485C69.410411 600.858422 0 500.507993 0 378.38496 0 166.683208 208.689602 0 463.510935 0c227.908428 0 427.594322 133.18941 467.701752 312.379588a427.463358 427.463358 0 0 0-44.625655-2.619261c-220.24709 0-394.100524 157.74498-394.100525 352.126871zM312.90344 189.143369a64.270111 64.270111 0 0 0-69.803299 55.659291 64.532037 64.532037 0 0 0 69.803299 55.659292 53.694846 53.694846 0 0 0 57.852923-55.659292 53.465661 53.465661 0 0 0-57.852923-55.659291z m324.428188 0a64.040926 64.040926 0 0 0-69.574114 55.659291 64.302852 64.302852 0 0 0 69.574114 55.659292 53.694846 53.694846 0 0 0 57.951145-55.659292 53.465661 53.465661 0 0 0-57.951145-55.659291z" p-id="6275"></path></svg></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-bbda3dac data-v-d27067a3 data-v-e77e15c7><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-e77e15c7><span class="vpi-more-horizontal icon" data-v-e77e15c7></span></button><div class="menu" data-v-e77e15c7><div class="VPMenu" data-v-e77e15c7 data-v-b172ad26><!----><!--[--><!--[--><!----><div class="group" data-v-d27067a3><div class="item appearance" data-v-d27067a3><p class="label" data-v-d27067a3>深浅模式</p><div class="appearance-action" data-v-d27067a3><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="Switch to light theme" aria-checked="true" data-v-d27067a3 data-v-1efe56b3 data-v-500272df><span class="check" data-v-500272df><span class="icon" data-v-500272df><!--[--><span class="vpi-sun sun" data-v-1efe56b3></span><span class="vpi-moon moon" data-v-1efe56b3></span><!--]--></span></span></button></div></div></div><div class="group" data-v-d27067a3><div class="item social-links" data-v-d27067a3><div class="VPSocialLinks social-links-list" data-v-d27067a3 data-v-31ce25be><!--[--><a class="VPSocialLink no-icon" href="https://github.com/Yiov/vitepress-doc" aria-label="github" target="_blank" rel="noopener" data-v-31ce25be data-v-175b4e05><span class="vpi-social-github" /></a><a class="VPSocialLink no-icon" href="https://weixin.qq.com/" aria-label="wechat" target="_blank" rel="noopener" data-v-31ce25be data-v-175b4e05><svg t="1703483542872" class="icon" viewBox="0 0 1309 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6274" width="200" height="200"><path d="M1147.26896 912.681417l34.90165 111.318583-127.165111-66.823891a604.787313 604.787313 0 0 1-139.082747 22.263717c-220.607239 0-394.296969-144.615936-394.296969-322.758409s173.526026-322.889372 394.296969-322.889372C1124.219465 333.661082 1309.630388 478.669907 1309.630388 656.550454c0 100.284947-69.344929 189.143369-162.361428 256.130963zM788.070086 511.869037a49.11114 49.11114 0 0 0-46.360916 44.494692 48.783732 48.783732 0 0 0 46.360916 44.494693 52.090549 52.090549 0 0 0 57.983885-44.494693 52.385216 52.385216 0 0 0-57.983885-44.494692z m254.985036 0a48.881954 48.881954 0 0 0-46.09899 44.494692 48.620028 48.620028 0 0 0 46.09899 44.494693 52.385216 52.385216 0 0 0 57.983886-44.494693 52.58166 52.58166 0 0 0-57.951145-44.494692z m-550.568615 150.018161a318.567592 318.567592 0 0 0 14.307712 93.212943c-14.307712 1.080445-28.746387 1.768001-43.283284 1.768001a827.293516 827.293516 0 0 1-162.394168-22.296458l-162.001279 77.955749 46.328175-133.811485C69.410411 600.858422 0 500.507993 0 378.38496 0 166.683208 208.689602 0 463.510935 0c227.908428 0 427.594322 133.18941 467.701752 312.379588a427.463358 427.463358 0 0 0-44.625655-2.619261c-220.24709 0-394.100524 157.74498-394.100525 352.126871zM312.90344 189.143369a64.270111 64.270111 0 0 0-69.803299 55.659291 64.532037 64.532037 0 0 0 69.803299 55.659292 53.694846 53.694846 0 0 0 57.852923-55.659292 53.465661 53.465661 0 0 0-57.852923-55.659291z m324.428188 0a64.040926 64.040926 0 0 0-69.574114 55.659291 64.302852 64.302852 0 0 0 69.574114 55.659292 53.694846 53.694846 0 0 0 57.951145-55.659292 53.465661 53.465661 0 0 0-57.951145-55.659291z" p-id="6275"></path></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-bbda3dac data-v-3404c5b3><span class="container" data-v-3404c5b3><span class="top" data-v-3404c5b3></span><span class="middle" data-v-3404c5b3></span><span class="bottom" data-v-3404c5b3></span></span></button></div></div></div></div><div class="divider" data-v-bbda3dac><div class="divider-line" data-v-bbda3dac></div></div></div><!----></header><div class="VPLocalNav empty fixed" data-v-70d64d62 data-v-08210d35><div class="container" data-v-08210d35><!----><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-08210d35 data-v-3fd12a90><button data-v-3fd12a90>返回顶部</button><!----></div></div></div><!----><div class="VPContent" id="VPContent" data-v-70d64d62 data-v-fc14e59f><div class="VPDoc has-aside" data-v-fc14e59f data-v-7b8f9c01><!--[--><!--]--><div class="container" data-v-7b8f9c01><div class="aside" data-v-7b8f9c01><div class="aside-curtain" data-v-7b8f9c01></div><div class="aside-container" data-v-7b8f9c01><div class="aside-content" data-v-7b8f9c01><div class="VPDocAside" data-v-7b8f9c01 data-v-f7d201ac><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-f7d201ac data-v-a8490648><div class="content" data-v-a8490648><div class="outline-marker" data-v-a8490648></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-a8490648>当前页大纲</div><ul class="VPDocOutlineItem root" data-v-a8490648 data-v-6d0ac89a><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-f7d201ac></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-7b8f9c01><div class="content-container" data-v-7b8f9c01><!--[--><!--]--><main class="main" data-v-7b8f9c01><div style="position:relative;" class="vp-doc _mattchen-blog_getting-started" data-v-7b8f9c01><div><h1 id="快速上手" tabindex="-1">快速上手 <a class="header-anchor" href="#快速上手" aria-label="Permalink to "快速上手""></a></h1><div class="word"><p><svg t="1724572866572" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18131" width="16" height="16"><path d="M168.021333 504.192A343.253333 343.253333 0 0 1 268.629333 268.8a342.229333 342.229333 0 0 1 243.285334-100.778667A341.504 341.504 0 0 1 755.029333 268.8c9.856 9.898667 19.2 20.394667 27.733334 31.402667l-60.16 46.976a8.021333 8.021333 0 0 0 2.986666 14.122666l175.701334 43.008a8.021333 8.021333 0 0 0 9.898666-7.68l0.810667-180.906666a7.936 7.936 0 0 0-12.885333-6.314667L842.666667 253.44a418.858667 418.858667 0 0 0-330.922667-161.493333c-229.12 0-415.488 183.594667-419.797333 411.818666a8.021333 8.021333 0 0 0 8.021333 8.192H160a7.978667 7.978667 0 0 0 8.021333-7.808zM923.946667 512H864a7.978667 7.978667 0 0 0-8.021333 7.808 341.632 341.632 0 0 1-26.88 125.994667 342.186667 342.186667 0 0 1-73.685334 109.397333 342.442667 342.442667 0 0 1-243.328 100.821333 342.229333 342.229333 0 0 1-270.976-132.224l60.16-46.976a8.021333 8.021333 0 0 0-2.986666-14.122666l-175.701334-43.008a8.021333 8.021333 0 0 0-9.898666 7.68l-0.682667 181.034666c0 6.698667 7.68 10.496 12.885333 6.314667L181.333333 770.56a419.072 419.072 0 0 0 330.922667 161.408c229.205333 0 415.488-183.722667 419.797333-411.818667a8.021333 8.021333 0 0 0-8.021333-8.192z" fill="#8a8a8a" p-id="18132"></path></svg> 更新: 9/4/2024 <svg t="1724571760788" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6125" width="16" height="16"><path d="M204.8 0h477.866667l273.066666 273.066667v614.4c0 75.093333-61.44 136.533333-136.533333 136.533333H204.8c-75.093333 0-136.533333-61.44-136.533333-136.533333V136.533333C68.266667 61.44 129.706667 0 204.8 0z m307.2 607.573333l68.266667 191.146667c13.653333 27.306667 54.613333 27.306667 61.44 0l102.4-273.066667c6.826667-20.48 0-34.133333-20.48-40.96s-34.133333 0-40.96 13.653334l-68.266667 191.146666-68.266667-191.146666c-13.653333-27.306667-54.613333-27.306667-68.266666 0l-68.266667 191.146666-68.266667-191.146666c-6.826667-13.653333-27.306667-27.306667-47.786666-20.48s-27.306667 27.306667-20.48 47.786666l102.4 273.066667c13.653333 27.306667 54.613333 27.306667 61.44 0l75.093333-191.146667z" fill="#777777" p-id="6126"></path><path d="M682.666667 0l273.066666 273.066667h-204.8c-40.96 0-68.266667-27.306667-68.266666-68.266667V0z" fill="#E0E0E0" opacity=".619" p-id="6127"></path></svg> 字数: 0 字 <svg t="1724572797268" class="icon" viewBox="0 0 1060 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="15031" width="16" height="16"><path d="M556.726857 0.256A493.933714 493.933714 0 0 0 121.929143 258.998857L0 135.021714v350.390857h344.649143L196.205714 334.482286a406.820571 406.820571 0 1 1-15.908571 312.649143H68.937143A505.819429 505.819429 0 1 0 556.726857 0.256z m-79.542857 269.531429v274.907428l249.197714 150.966857 42.422857-70.070857-212.114285-129.389714V269.787429h-79.542857z" fill="#8a8a8a" p-id="15032"></path></svg> 时长: 0 分钟 </p></div><div class="linkcard"><a href="https://vitepress.new/" target="_blank"><p class="description">在线体验及调试（StackBlitz 驱动）<br><span>https://vitepress.new/</span></p><div class="logo"><img alt="logo" width="70px" height="70px" src="/svg/stackblitz_logo.svg"></div></a></div><h2 id="前期工作" tabindex="-1">前期工作 <a class="header-anchor" href="#前期工作" aria-label="Permalink to "前期工作""></a></h2><div class="tip custom-block"><p class="custom-block-title">说明</p><p>已经安装 或者 熟练了，可以不用看此步骤</p></div><details class="details custom-block"><summary>必备工具</summary><ul><li><p>必装：<a href="https://yiov.top/website/nodejs.html" target="_blank" rel="noreferrer">安装nodejs</a></p></li><li><p>建议安装：<a href="https://yiov.top/website/VSCode.html" target="_blank" rel="noreferrer">安装vscode</a></p></li><li><p>可选安装：<a href="https://yiov.top/website/pages/git.html" target="_blank" rel="noreferrer">安装git</a></p></li></ul></details><details class="details custom-block"><summary>pnpm / yarn / bun</summary><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-hkMMB" id="tab-nttfn5o" checked><label data-title="pnpm" for="tab-nttfn5o">pnpm</label><input type="radio" name="group-hkMMB" id="tab-PNutCM-"><label data-title="yarn" for="tab-PNutCM-">yarn</label><input type="radio" name="group-hkMMB" id="tab-0ZfI22N"><label data-title="bun" for="tab-0ZfI22N">bun</label></div><div class="blocks"><div class="language-sh vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">#安装pnpm</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -g</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> pnpm</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">#查看版本号</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -v</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br></div></div><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">#安装yarn</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -g</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> yarn</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">#查看版本号</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -v</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br></div></div><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">#安装yarn</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> install</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -g</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> bun</span></span>
<span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">#查看版本号</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">bun</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -v</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br></div></div></div></div></details><details class="details custom-block"><summary>创建目录</summary><p><code>win键+R键</code>，输入 <code>cmd</code>，打开命令终端</p><p><img src="/mattchen-blog/cmd/cmd-01.png" alt="" loading="lazy"></p><p>先进入任意盘符，比如 <code>F</code> 盘</p><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">#盘符可以自定义 回车进入</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">f:</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br></div></div><p><img src="/mattchen-blog/cmd/cmd-02.png" alt="" loading="lazy"></p><p>再创建文件夹名并进入</p><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">#创建目录并进入文件夹</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">mkdir</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> && </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">cd</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br></div></div><p>这样我的目录路径为 <code>F:\vitepress</code></p><p>我们先关闭cmd，一会介绍快捷进入的方法</p><p><img src="/mattchen-blog/cmd/cmd-03.png" alt="" loading="lazy"></p></details><h2 id="安装" tabindex="-1">安装 <a class="header-anchor" href="#安装" aria-label="Permalink to "安装""></a></h2><h3 id="安装依赖" tabindex="-1">安装依赖 <a class="header-anchor" href="#安装依赖" aria-label="Permalink to "安装依赖""></a></h3><p>在项目目录上方的地址栏，上输入 <code>cmd</code> 回车可以快捷打开</p><p><img src="/mattchen-blog/cmd/cmd-04.png" alt="" loading="lazy"></p><p><img src="/mattchen-blog/cmd/cmd-05.png" alt="" loading="lazy"></p><p>然后我们安装vitepress</p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-St2vG" id="tab-pXyDD6e" checked><label data-title="pnpm" for="tab-pXyDD6e">pnpm</label><input type="radio" name="group-St2vG" id="tab-VV8cJii"><label data-title="yarn" for="tab-VV8cJii">yarn</label><input type="radio" name="group-St2vG" id="tab-yLXYXSh"><label data-title="npm" for="tab-yLXYXSh">npm</label><input type="radio" name="group-St2vG" id="tab-OCYtyoP"><label data-title="bun" for="tab-OCYtyoP">bun</label></div><div class="blocks"><div class="language-sh vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -D</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -D</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> i</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -D</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">bun</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> add</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> -D</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><p><img src="/mattchen-blog/cmd/cmd-06.png" alt="" loading="lazy"></p><h3 id="初始化向导" tabindex="-1">初始化向导 <a class="header-anchor" href="#初始化向导" aria-label="Permalink to "初始化向导""></a></h3><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-AUb1v" id="tab-wu49if-" checked><label data-title="pnpm" for="tab-wu49if-">pnpm</label><input type="radio" name="group-AUb1v" id="tab-RXLk3im"><label data-title="yarn" for="tab-RXLk3im">yarn</label><input type="radio" name="group-AUb1v" id="tab-_F2ju85"><label data-title="npm" for="tab-_F2ju85">npm</label><input type="radio" name="group-AUb1v" id="tab-3u4m1B0"><label data-title="bun" for="tab-3u4m1B0">bun</label></div><div class="blocks"><div class="language-sh vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> init</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> init</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npx</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> init</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">bunx</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> init</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><details class="details custom-block"><summary>文件位置放在 <code>./docs</code></summary><p>文件夹名新手请参照下面，老手可以自己改</p><p>如果你直接回车，则是放在了根目录 <code>./</code>，那你的 <a href="#脚本命令">脚本命令</a> 也要修改一下</p></details><div class="language-sh vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">T</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Welcome</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> to</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> VitePress!</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">o</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Where</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> should</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> VitePress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> initialize</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> the</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> config?</span></span>
<span class="line highlighted"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> ./docs</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">o</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Site</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> title:</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> My</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Awesome</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Project</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">o</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Site</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> description:</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> A</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> VitePress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Site</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">o</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Theme:</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Default</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Theme</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">o</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Use</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> TypeScript</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> for</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> config</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> and</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> theme</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> files?</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Yes</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">o</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Add</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> VitePress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> scripts</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> to</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> package.json?</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Yes</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">|</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">—</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Done!</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Now</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> run</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> run</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs:dev</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> and</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> start</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> writing.</span></span></code></pre></div><div class="tip custom-block"><p class="custom-block-title">Vue 作为对等依赖</p><p>如果您打算使用 Vue 组件或 API 进行自定义，您还应该显式 <a href="./components.html#安装">安装 Vue</a> 作为对等依赖项</p><p>如果你不懂，我们先暂时不看，我们后面会详细说</p></div><h3 id="脚本命令" tabindex="-1">脚本命令 <a class="header-anchor" href="#脚本命令" aria-label="Permalink to "脚本命令""></a></h3><p>默认不用改，在 <code>package.json</code> 中可以查看</p><div class="warning custom-block"><p class="custom-block-title">注意</p><p>如果你在初始化的时候选择了 <code>./</code> ，而不是 <code>./doc</code>，这里就需要修改</p></div><div class="language-json vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">json</span><pre class="shiki shiki-themes github-light github-dark has-focused-lines vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">{</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "devDependencies"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "vitepress"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"^1.3.4"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> },</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "packageManager"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"[email protected]+sha1.98fe2755061026799bfa30e7dc8d6d48e9c3edf0"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line highlighted has-focus"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "scripts"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: { </span></span>
<span class="line highlighted has-focus"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "docs:dev"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"vitepress dev docs"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line highlighted has-focus"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "docs:build"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"vitepress build docs"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line highlighted has-focus"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "docs:preview"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"vitepress preview docs"</span></span>
<span class="line highlighted has-focus"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br><span class="line-number">10</span><br><span class="line-number">11</span><br></div></div><h3 id="git忽略项" tabindex="-1">git忽略项 <a class="header-anchor" href="#git忽略项" aria-label="Permalink to "git忽略项""></a></h3><p>添加 <code>.gitignore</code> 文件，主要用于上传到gitee/github时，忽略这些文件不上传</p><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">echo</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> node_modules</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> >></span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> .gitignore</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">echo</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> cache</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> >></span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> .gitignore</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">echo</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> dist</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> >></span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> .gitignore</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br></div></div><p><img src="/mattchen-blog/cmd/cmd-07.png" alt="" loading="lazy"></p><h2 id="启动" tabindex="-1">启动 <a class="header-anchor" href="#启动" aria-label="Permalink to "启动""></a></h2><p>本地启动开发环境，来开发你的网站</p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-Pne0F" id="tab-_1OutQx" checked><label data-title="pnpm" for="tab-_1OutQx">pnpm</label><input type="radio" name="group-Pne0F" id="tab-4rNBCp1"><label data-title="yarn" for="tab-4rNBCp1">yarn</label><input type="radio" name="group-Pne0F" id="tab-1Q1vLVX"><label data-title="npm" for="tab-1Q1vLVX">npm</label><input type="radio" name="group-Pne0F" id="tab-q3BG2EU"><label data-title="bun" for="tab-q3BG2EU">bun</label></div><div class="blocks"><div class="language-sh vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> run</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs:dev</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">yarn</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs:dev</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> run</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs:dev</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">bun</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> run</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs:dev</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div><p>生成了一个本地 <code>5173</code> 端口的链接，复制到浏览器打开进行预览</p><div class="language-sh vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">F:\vitepress</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">></span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> run</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs:dev</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> @ docs:dev F:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">\v</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">itepress</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> vitepress dev docs</span></span>
<span class="line"></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> v1.3.4</span></span>
<span class="line"></span>
<span class="line highlighted"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> ➜</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Local:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> http://localhost:5173/</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> ➜</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> Network:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> use</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> --host</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> to</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> expose</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> ➜</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> press</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> h</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> to</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> show</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> help</span></span></code></pre></div><p>按 <code>Ctrl+C键</code> 即可退出开发模式</p><p>我们可以关闭cmd，以后全程用 <a href="https://yiov.top/website/VSCode.html" target="_blank" rel="noreferrer">VScode</a> 了</p><p><img src="/mattchen-blog/cmd/cmd-08.png" alt="" loading="lazy"></p><h2 id="相关" tabindex="-1">相关 <a class="header-anchor" href="#相关" aria-label="Permalink to "相关""></a></h2><p>无特殊情况，不需要了解</p><details class="details custom-block"><summary>拓展：启动端口修改</summary><p>若无必要，不用修改，需要在 <a href="#脚本命令">脚本命令</a> 中修改端口</p><p>这样就是 <code>8080</code> 端口启动了</p><div class="language-json vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">json</span><pre class="shiki shiki-themes github-light github-dark has-focused-lines vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> "scripts"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: {</span></span>
<span class="line highlighted has-focus"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> "docs:preview"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">"vitepress preview docs --port 8080"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> }</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br></div></div></details><details class="details custom-block"><summary>拓展：其他启动命令</summary><p>你也可以直接调用命令</p><div class="vp-code-group vp-adaptive-theme"><div class="tabs"><input type="radio" name="group-boWQG" id="tab-Li78WGr" checked><label data-title="pnpm" for="tab-Li78WGr">pnpm</label><input type="radio" name="group-boWQG" id="tab-OxOsrTM"><label data-title="npm" for="tab-OxOsrTM">npm</label><input type="radio" name="group-boWQG" id="tab-T79XNo0"><label data-title="bun" for="tab-T79XNo0">bun</label></div><div class="blocks"><div class="language-sh vp-adaptive-theme active line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">pnpm</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> exec</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> dev</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">npx</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> dev</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><div class="language-sh vp-adaptive-theme line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">sh</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">bunx</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> vitepress</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> dev</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> docs</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div></div></details></div></div></main><footer class="VPDocFooter" data-v-7b8f9c01 data-v-965f531d><!--[--><!--[--><!--[--><!--[--><div style="" class="vitepress-backTop-main" title="返回顶部" data-v-5b765887><svg t="1720595052079" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4279" width="200" height="200" data-v-5b765887><path d="M752.736 431.063C757.159 140.575 520.41 8.97 504.518 0.41V0l-0.45 0.205-0.41-0.205v0.41c-15.934 8.56-252.723 140.165-248.259 430.653-48.21 31.457-98.713 87.368-90.685 184.074 8.028 96.666 101.007 160.768 136.601 157.287 35.595-3.482 25.232-30.31 25.232-30.31l12.206-50.095s52.47 80.569 69.304 80.528c15.114-1.23 87-0.123 95.6 0h0.82c8.602-0.123 80.486-1.23 95.6 0 16.794 0 69.305-80.528 69.305-80.528l12.165 50.094s-10.322 26.83 25.272 30.31c35.595 3.482 128.574-60.62 136.602-157.286 8.028-96.665-42.475-152.617-90.685-184.074z m-248.669-4.26c-6.758-0.123-94.781-3.359-102.891-107.192 2.95-98.714 95.97-107.438 102.891-107.93 6.964 0.492 99.943 9.216 102.892 107.93-8.11 103.833-96.174 107.07-102.892 107.192z m-52.019 500.531c0 11.838-9.42 21.382-21.012 21.382a21.217 21.217 0 0 1-21.054-21.34V821.74c0-11.797 9.421-21.382 21.054-21.382 11.591 0 21.012 9.585 21.012 21.382v105.635z m77.333 57.222a21.504 21.504 0 0 1-21.34 21.626 21.504 21.504 0 0 1-21.34-21.626V827.474c0-11.96 9.543-21.668 21.299-21.668 11.796 0 21.38 9.708 21.38 21.668v157.082z m71.147-82.043c0 11.796-9.42 21.34-21.053 21.34a21.217 21.217 0 0 1-21.013-21.34v-75.367c0-11.755 9.421-21.299 21.013-21.299 11.632 0 21.053 9.544 21.053 21.3v75.366z" fill="#FFF" p-id="4280" data-v-5b765887></path></svg></div><!--]--><!--]--><!--]--><!--]--><div class="edit-info" data-v-965f531d><!----><div class="last-updated" data-v-965f531d><p class="VPLastUpdated" data-v-965f531d data-v-14f453f0>上次更新时间: <time datetime="2024-09-04T06:21:45.000Z" data-v-14f453f0></time></p></div></div><!----></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter" data-v-70d64d62 data-v-81c725e8><div class="container" data-v-81c725e8><p class="message" data-v-81c725e8>Released under the MIT License.</p><p class="copyright" data-v-81c725e8>Copyright © 2024-2024 Quan Chen</p></div></footer><!--[--><!--]--></div></div>
<script>window.__VP_HASH_MAP__=JSON.parse("{\"about_index.md\":\"CY9yucSH\",\"assets.md\":\"DfQ51jtO\",\"changelog.md\":\"BAYrSUdb\",\"components.md\":\"DXc0HQ6P\",\"configuration.md\":\"DoVLNqO_\",\"frontmatter.md\":\"Dh_-mUeJ\",\"getting-started.md\":\"BEfG1NoJ\",\"index.md\":\"OiIylk7z\",\"layout.md\":\"DU6YGqOu\",\"markdown.md\":\"DMP6xm3M\",\"nav_index.md\":\"BtdCK87h\",\"nav_mao.md\":\"B42MwPdM\",\"notes_concept.md\":\"D7Dz28p-\",\"notes_index.md\":\"C7ub5zn7\",\"notes_object detection_yolo系列详解.md\":\"DgzFA62H\",\"notes_paper.md\":\"BYszF7Dp\",\"notes_sementic segmentation_无监督语义分割调研.md\":\"D4KEGRiP\",\"page.md\":\"CpEXFM0X\",\"plugin.md\":\"DQQriVv2\",\"preface.md\":\"DFDnoP7W\",\"programming_c__.md\":\"BmH6fGUC\",\"programming_command.md\":\"C30yelnV\",\"programming_index.md\":\"BxY-Ryo5\",\"programming_python.md\":\"CV5Ci5uB\",\"programming_ubuntu.md\":\"BQF_QkGM\",\"style.md\":\"DKmjAuqv\",\"team.md\":\"CQuvelut\",\"tools_index.md\":\"qsUIfi45\",\"update.md\":\"3880nQLe\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"zh-CN\",\"dir\":\"ltr\",\"title\":\"Quan Chen\",\"description\":\"Quan Chen's blog\",\"base\":\"/mattchen-blog/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":\"dark\",\"themeConfig\":{\"logo\":\"/logo.png\",\"lastUpdated\":{\"text\":\"上次更新时间\",\"formatOptions\":{\"dateStyle\":\"short\",\"timeStyle\":\"medium\"}},\"nav\":[{\"text\":\"DLNotes\",\"link\":\"/notes/\"},{\"text\":\"Math\",\"link\":\"/math/\"},{\"text\":\"Programming\",\"link\":\"/Programming/\"},{\"text\":\"Tools\",\"link\":\"/tools/\"},{\"text\":\"About\",\"link\":\"/about/\"}],\"search\":{\"provider\":\"local\",\"options\":{\"locales\":{\"zh\":{\"translations\":{\"button\":{\"buttonText\":\"搜索文档\",\"buttonAriaLabel\":\"搜索文档\"},\"modal\":{\"noResultsText\":\"无法找到相关结果\",\"resetButtonTitle\":\"清除查询条件\",\"footer\":{\"selectText\":\"选择\",\"navigateText\":\"切换\"}}}}}}},\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/Yiov/vitepress-doc\"},{\"icon\":{\"svg\":\"<svg t=\\\"1703483542872\\\" class=\\\"icon\\\" viewBox=\\\"0 0 1309 1024\\\" version=\\\"1.1\\\" xmlns=\\\"http://www.w3.org/2000/svg\\\" p-id=\\\"6274\\\" width=\\\"200\\\" height=\\\"200\\\"><path d=\\\"M1147.26896 912.681417l34.90165 111.318583-127.165111-66.823891a604.787313 604.787313 0 0 1-139.082747 22.263717c-220.607239 0-394.296969-144.615936-394.296969-322.758409s173.526026-322.889372 394.296969-322.889372C1124.219465 333.661082 1309.630388 478.669907 1309.630388 656.550454c0 100.284947-69.344929 189.143369-162.361428 256.130963zM788.070086 511.869037a49.11114 49.11114 0 0 0-46.360916 44.494692 48.783732 48.783732 0 0 0 46.360916 44.494693 52.090549 52.090549 0 0 0 57.983885-44.494693 52.385216 52.385216 0 0 0-57.983885-44.494692z m254.985036 0a48.881954 48.881954 0 0 0-46.09899 44.494692 48.620028 48.620028 0 0 0 46.09899 44.494693 52.385216 52.385216 0 0 0 57.983886-44.494693 52.58166 52.58166 0 0 0-57.951145-44.494692z m-550.568615 150.018161a318.567592 318.567592 0 0 0 14.307712 93.212943c-14.307712 1.080445-28.746387 1.768001-43.283284 1.768001a827.293516 827.293516 0 0 1-162.394168-22.296458l-162.001279 77.955749 46.328175-133.811485C69.410411 600.858422 0 500.507993 0 378.38496 0 166.683208 208.689602 0 463.510935 0c227.908428 0 427.594322 133.18941 467.701752 312.379588a427.463358 427.463358 0 0 0-44.625655-2.619261c-220.24709 0-394.100524 157.74498-394.100525 352.126871zM312.90344 189.143369a64.270111 64.270111 0 0 0-69.803299 55.659291 64.532037 64.532037 0 0 0 69.803299 55.659292 53.694846 53.694846 0 0 0 57.852923-55.659292 53.465661 53.465661 0 0 0-57.852923-55.659291z m324.428188 0a64.040926 64.040926 0 0 0-69.574114 55.659291 64.302852 64.302852 0 0 0 69.574114 55.659292 53.694846 53.694846 0 0 0 57.951145-55.659292 53.465661 53.465661 0 0 0-57.951145-55.659291z\\\" p-id=\\\"6275\\\"></path></svg>\"},\"link\":\"https://weixin.qq.com/\",\"ariaLabel\":\"wechat\"}],\"darkModeSwitchLabel\":\"深浅模式\",\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2024-2024 Quan Chen\"},\"sidebarMenuLabel\":\"目录\",\"returnToTopLabel\":\"返回顶部\",\"outline\":{\"level\":[2,3],\"label\":\"当前页大纲\"},\"docFooter\":{\"prev\":\"上一页\",\"next\":\"下一页\"},\"sidebar\":{\"/nav/\":[{\"items\":[{\"text\":\"mao\",\"link\":\"/nav/mao.html\"}]}],\"/notes/\":[{\"items\":[{\"text\":\"Object Detection\",\"items\":[{\"text\":\"Yolo系列详解\",\"link\":\"/notes/Object Detection/Yolo系列详解.html\"}]},{\"text\":\"Sementic Segmentation\",\"items\":[{\"text\":\"无监督语义分割调研\",\"link\":\"/notes/Sementic Segmentation/无监督语义分割调研.html\"}]},{\"text\":\"concept\",\"link\":\"/notes/concept.html\"},{\"text\":\"paper\",\"link\":\"/notes/paper.html\"}]}],\"/programming/\":[{\"items\":[{\"text\":\"C++\",\"link\":\"/programming/C++.html\"},{\"text\":\"Command\",\"link\":\"/programming/Command.html\"},{\"text\":\"Python\",\"link\":\"/programming/Python.html\"},{\"text\":\"Ubuntu\",\"link\":\"/programming/Ubuntu.html\"}]}]}},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
</body>
</html>