Github-Pages自动部署VuePress项目，一劳永逸！

Github-Pages因其简便性而深受开发者和博主的喜爱，它可以轻松地将静态网站托管在GitHub上，并通过自定义域名访问。VuePress是一个基于Vue.js的静态网站生成器，使用它可以快速搭建出美观大方的博客或文档网站。将两者结合，就可以实现自动部署VuePress项目的强大功能。

以下是你需要准备的：

1. 一个GitHub账号
2. 一个VuePress项目
3. 一个自定义域名（可选）

**步骤1：设置Github-Pages** 

1. 登录你的GitHub账号，点击右上角的头像，选择"Settings"。
2. 在左侧菜单中，找到"Pages"选项，然后点击它。
3. 在"Source"下拉框中，选择你的VuePress项目仓库。
4. 在"Branch"下拉框中，选择要部署的分支，通常是"main"分支。
5. 点击"Save"按钮保存设置。

**步骤2：设置VuePress项目** 

1. 在VuePress项目的根目录下，创建一个名为".vuepress/config.js"的文件。
2. 在文件中添加以下内容：

module.exports = {
dest: 'docs/.vuepress/dist'
};

3. 将VuePress项目提交到GitHub。

**步骤3：部署VuePress项目** 

1. 登录你的GitHub账号，进入你的VuePress项目仓库。
2. 点击"Actions"选项卡。
3. 点击"New workflow"按钮，创建一个新的工作流。
4. 选择"Set up a workflow yourself"选项，然后点击"Next"按钮。
5. 在"Workflow name"输入框中，输入一个工作流名称，例如"Deploy VuePress Project"。
6. 在"On"部分，选择"Push"触发器，然后点击"Next"按钮。
7. 在"Jobs"部分，点击"Add a job"按钮，添加一个新任务。
8. 在"Job name"输入框中，输入一个任务名称，例如"Deploy VuePress Project"。
9. 在"Runs on"下拉框中，选择要运行任务的操作系统，例如"Ubuntu"。
10. 在"Steps"部分，点击"Add a step"按钮，添加一个新步骤。
11. 在"Use an action"输入框中，输入"actions/checkout"，然后点击"Enter"键。
12. 在"with"部分，添加以下内容：

ref: ${process.env.GITHUB_REF}

13. 点击"Add another step"按钮，添加另一个步骤。
14. 在"Use an action"输入框中，输入"actions/setup-node"，然后点击"Enter"键。
15. 在"with"部分，添加以下内容：

node-version: '16.x'

16. 点击"Add another step"按钮，添加另一个步骤。
17. 在"Use an action"输入框中，输入"nrwl/nx-run"，然后点击"Enter"键。
18. 在"with"部分，添加以下内容：

target: build
project: vuepress

19. 点击"Save workflow"按钮保存工作流。

**步骤4：测试部署** 

1. 将一个新的提交推送到GitHub。
2. 等待工作流运行完成。
3. 访问你的自定义域名或GitHub Pages提供的URL，查看你的VuePress项目是否已经成功部署。

**步骤5：自定义域名** 

如果你想使用自定义域名，你需要在域名提供商处添加一条CNAME记录，将你的域名指向GitHub Pages的URL。

**优点** ：

- 自动化部署，无需手动操作
- 云端托管，无需维护服务器
- 支持自定义域名
- 免费使用

**缺点** ：

- GitHub Pages不支持动态内容
- GitHub Pages的存储空间有限
- GitHub Pages的带宽有限

希望本教程对您有所帮助。如果您有任何问题，请随时留言。