企业官网建设流程全解析

3 分钟 / 3 步完成 Element Plus 文档站本地部署

【免费下载链接】element-plus🎉 A Vue.js 3 UI Library made by Element team项目地址: https://gitcode.com/GitHub_Trending/el/element-plus

完成 Element Plus 文档站本地部署后，你会得到一套离线可用的完整文档：组件演示、API 表格、主题介绍全都保留。整个流程 3 步，大约 4 分钟。

命令速查

为什么值得在本地跑

官方站服务器在海外，高峰期打开慢还容易超时。本地是 VitePress 静态站点，全部源码在 docs/ 目录里，克隆下来后断网也能查。同一局域网的同事也能直接访问，顺带还能看组件源码和演示代码。

跟着做

确认 Node 22 与 pnpm 版本

这步确认环境满足项目要求。仓库规定 Node ≥ 22.13.0、pnpm 11.24.0（见根目录 package.json），用 corepack 激活最省事。

node -v corepack enable && corepack prepare pnpm@11.24.0 --activate

跑完你应该看到pnpm -v输出 11.24.0。Node 不够就先升级，后面所有命令都以它为前提。

克隆 Element Plus 仓库

把仓库代码拿到本地，文档站的所有内容都在docs/里。

git clone https://gitcode.com/GitHub_Trending/el/element-plus cd element-plus

跑完你应该看到当前目录出现docs/、packages/等文件夹。

用 pnpm 在根目录安装依赖

这是个 pnpm 多包仓库，文档站是docs/子包，但依赖必须从根目录一条命令装全。

pnpm install

跑完你应该看到node_modules生成、输出以Done结尾。postinstall 会顺手把组件库 stub 起来，首次安装较慢，正常。

启动 2000 端口的文档站服务

docs:dev会先生成本地语言包再启动 VitePress，端口 2000，且 host 绑定所有网卡（见 docs/.vitepress/config/vite.ts），同网段同事也能直接访问。

pnpm docs:dev

终端出现Local: http://localhost:2000/说明成功了，打开就是完整文档首页。

构建 VitePress 静态离线版（可选）

打算长期挂给团队用，就构建纯静态版本，比 dev 服务更稳，也不受源码热更新影响。

pnpm docs:build pnpm docs:serve

跑完你应该看到build产出静态dist，serve在 5001 端口托管它。

跑不起来？对照排查

• 如果pnpm install报 engines 或版本错误，就说明 Node 低于 22.13.0，先升级 Node 再装。
• 如果装到一半缺模块、依赖报错，就删掉node_modules重新pnpm install，这是官方 FAQ 给出的处理方式，见 docs/en-US/guide/dev-faq.md。
• 如果 2000 端口被占用，就找到占用进程把它结束，端口空出来再pnpm docs:dev。
• 如果corepack prepare本身报错，就先单独跑corepack enable激活 corepack，再重试。

再往前一步

如果之后要改组件而不只是看文档，读 docs/en-US/guide/dev-guide.md，里面讲了pnpm dev起的 play 项目；组件源码都在 packages/components/，可以对照演示直接看实现。

【免费下载链接】element-plus🎉 A Vue.js 3 UI Library made by Element team项目地址: https://gitcode.com/GitHub_Trending/el/element-plus