最近开发了新的软件——天璇SSH，于是想要给他做个网站，到网上楼搜罗一圈，发现vitepress界面简洁，还好操作，于是本期教程使用vitepress部署。
本次需要的东西有：
Node.js版本 18 或更高版本。
用于通过命令行界面 (CLI) 访问 VitePress 的终端。
支持Markdown语法的文本编辑器，建议使用VSCode以及官方的 Vue 扩展。
0、安装依赖
在正式安装之前，我们需要安装nodejs、vscode等等软件，用以驱动vitepress。
**本教程默认您使用全新环境，没有任何冲突，如有问题，请咨询AI！！**
常规方法......
进入nodejs下载界面，按照提示，获取属于自己的安装代码。原来还支持docker镜像吗（小声蛐蛐）或者使用 .msi 自行安装。
本次不使用这个方法，换成更便捷的nvm安装。
本次，我们通过nvm来实现对nodejs的管理。
下载nvm
进入nvm的GitHub链接，选择 nvm-setup.exe 文件下载，下载后，我们双击安装即可。
我们使用PowerShell打开命令行，这里需要注意下，要使用管理员身份打开PowerShell，如下所示：
输入以下命令，检查安装：
nvm version拓展一点......
在linux上使用nvm管理nodejs也很方便，在nvm的linux仓库，有对应的教程，仓库地址：https://github.com/nvm-sh/nvm
安装nodejs
安装好nvm后，再安装nvm会方便许多。
补充一点......
内容来自maku-admin开发文档，感谢！
查看Node.js可用的版本列表，可执行如下命令：
nvm ls available
安装版本号为20或者22的Node.js，可执行如下命令：
nvm install 20
查看已安装的版本号，可执行如下命令：
nvm list
切换版本号到20，可执行如下命令：
nvm use 20
查看当前Node.js的版本号，可执行如下命令：
node -v
卸载版本号为20的Node.js，可执行如下命令：
nvm uninstall 20 由于nodejs默认镜像源在国外，国内访问下载依赖会失败，要更改镜像源，加速访问，我们以淘宝镜像源为例：
在cmd中输入以下命令：
npm config set registry https://registry.npmmirror.com/查看镜像源是否安装成功：
npm config get registry1、开始安装！
VitePress 可以独立使用，也可以安装到现有项目中。无论哪种方式，您都可以使用以下命令进行安装：
npm add -D vitepress@next或者
pnpm add -D vitepress@nextVitePress 是一个仅支持 ESM 格式的软件包。请勿使用require(import 语句导入它，并确保您最近的 <path> 文件package.json包<path>，或者将相关文件（例如 .v1 .v2）"type": "module"的文件扩展名更改/ 。更多详情请参阅Vite 的故障排除指南。此外，在异步 CJS 上下文中，您可以使<path> 代替 <path>。.vitepress/config.js .mjs .mts await import('vitepress')
——https://vitepress.dev/guide/getting-started
VitePress 自带一个命令行安装向导，可以帮助您搭建一个基本项目。安装完成后，运行以下命令启动向导：
npx vitepress init或者
pnpm vitepress init接下来会出现几个问题，按照情况回答：
┌ Welcome to VitePress!
│ ◇ Where should VitePress initialize the config?
│ 写vitepress项目文件存放位置（从当前目录开始）（以./docs为例）
│ ◇ Where should VitePress look for your markdown files?
│ 写你的代码存放位置（以./docs为例）
│ ◇ Site title:
│ 标题
│ ◇ Site description:
│ 副标题
│ ◇ Theme:
│ Default Theme
│ ◇ Use TypeScript for config and theme files?
│ Yes
│ ◇ Add VitePress npm scripts to package.json?
│ Yes
│ ◇ Add a prefix for VitePress npm scripts?
│ Yes
│ ◇ Prefix for VitePress npm scripts:
│ docs
│
└ Done! Now run pnpm run docs:dev and start writing.Vue 作为对等依赖项
如果您打算使用 Vue 组件或 API 进行自定义，则还应显式地将其安装vue为依赖项。
安装完成后，当前目录下应该会出现这样的文件结构：
.
├─ docs
│ ├─ .vitepress
│ │ └─ config.js
│ ├─ api-examples.md
│ ├─ markdown-examples.md
│ └─ index.md <--- 首页
└─ package.json该docs目录被视为VitePress 网站的项目根目录.vitepress。该目录是 VitePress 配置文件、开发服务器缓存、构建输出以及可选主题自定义代码的保留位置。
**提示** 默认情况下，VitePress 将其开发服务器缓存存储<dev_server_cache> .vitepress/cache，将生产构建输出存储在 <production_build_output> .vitepress/dist。如果使用 Git，则应将它们添加到您的 .gitignore 文件中。这些位置也可以进行配置。
2、vitepress，启动！
vitepress默认支持以下命令：
npm
npm run docs:dev
npm run docs:build
npm run docs:preview如果你想本地预览，可以输入npm run docs:dev，在http://localhost:5127查看页面
如果你已经开发完成，执行npm run docs:build，将项目文件打包成网页文件（存放在./dist目录下）并上传服务器即可使用。
3、后记
这篇文章是我对vitepress部署的初步介绍，接下来，我会分享包括美化在内的vitepress使用教程，敬请期待吧~