快速搭建GitHub Page

推荐使用 Docsify 或 VitePress 来搭建 GitHub Pages 主页。

推荐使用 Docsify ，因为它的最大优点是无需编译------直接读取 Markdown 文件渲染成网站，部署极快且上手最简单。

---

第一阶段：本地准备与代码推送到 GitHub

1. 安装 Docsify 脚手架并初始化
   在终端（Terminal）中运行以下命令：

# 全局安装 docsify 工具
npm i docsify-cli -g

# 进入你的 front-skill 项目目录
cd path/to/front-skill

# 初始化文档目录（在当前项目下创建一个 docs 文件夹）
docsify init ./docs

2. 本地预览网站
   初始化完成后，在本地启动预览服务：

docsify serve ./docs

启动后，在浏览器访问 http://localhost:3000 即可看到网站预览。

3. 补充/修改文档内容

• 进入 docs/ 目录，你会看到 index.html 和 README.md。
• 编辑 docs/README.md，写下你的 Skill 项目介绍、技术栈和示例代码。
• (可选) 添加侧边栏：在 docs/ 目录下新建 _sidebar.md 文件，并在 index.html 中配置 loadSidebar: true 即可生成左侧导航栏。

4. 提交代码到 GitHub

git add .
git commit -m "feat: add docsify documentation"
git push origin main

---

第二阶段：开启并配置 GitHub Pages 部署

1. 浏览器打开你的仓库页面：[https://github.com/dddz-007/front-skill](https://github.com/dddz-007/front-skill)。
2. 点击顶部导航的 Settings（设置）。
3. 在左侧菜单栏中找到并点击 Pages。
4. 在 Build and deployment 部分：

• Source 保持选择：Deploy from a branch。
• Branch 选择：main 分支，目录选择 /docs （非常重要：选 /docs 文件夹而非 root）。

5. 点击 Save 保存。

---

第三阶段：访问你的 GitPage 主页

• 保存后，GitHub 会自动启动部署任务。稍等 1~2 分钟，刷新该设置页面。
• 页面顶部会提示绿色标记，显示你的主页链接：
  [https://dddz-007.github.io/front-skill/](https://dddz-007.github.io/front-skill/)
• 点击该链接即可直接访问你的 Skill 专属官网！