搭建博客记录

准备工作

Hexo官网

1. 按照文档操作即可 (生成一个blog工程)

github

1. 注册一个github账号（大家应该人手多个了-。-|||）
2. 创建一个新的仓库命名为youUserName.github.io
3. 把blog工程和youUserName.github.io远端仓库关联

困局，更改了md页面无法自动刷新

• 解决方案：安装hexo-browsersync插件，页面会自动刷新

github-pages（只有仓库是public状态才能免费使用）

1. 创建一个action

2. 新建.github/workflows/build.yml文件，如下：（用于执行action）

   # This is a basic workflow to help you get started with Actions
   
   name: build
   
   # Controls when the workflow will run
   on:
   # Triggers the workflow on push or pull request events but only for the blog branch
   push:
       branches: [ blog ]
   pull_request:
       branches: [ blog ]
   
   # Allows you to run this workflow manually from the Actions tab
   workflow_dispatch:
   
   # A workflow run is made up of one or more jobs that can run sequentially or in parallel
   jobs:
   # This workflow contains a single job called "build"
   build-and-deploy:
       # The type of runner that the job will run on
       runs-on: ubuntu-latest
   
       # Steps represent a sequence of tasks that will be executed as part of the job
       steps:
       # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
       - name: Checkout 🛎️
           uses: actions/checkout@v2.3.1
   
       - name: Install and Build 🔧 # This example project is built using npm and outputs the result to the 'build' folder. Replace with the commands required to build your project, or remove this step entirely if your site is pre-built.
           run: |
           npm install
           npm run build
       - name: Deploy 🚀
           # https://github.com/JamesIves/github-pages-deploy-action/tree/dev#using-an-ssh-deploy-key-
           uses: JamesIves/github-pages-deploy-action@4.1.5
           with:
           # https://github.com/JamesIves/github-pages-deploy-action/discussions/627
           # token: ${{ secrets.ACCESS_TOKEN }}
           branch: gh-pages # The branch the action should deploy to.
           folder: public # The folder the action should deploy.
           commit-message: docs 更新文档 
           clean: true

3. 执行在blog(或者任意分支)执行action；如图

   

4. action构建完成会自动生成gh-pages分支，并且把构建结果提交到该分支

5. 进入Settings页面，找到Pages选项，完成以下设置

   
   把gh-pages跟目录下的打包结果作为页面展示

6. 稍等一会github就可以用https://yourUserName.github.io展示

绑定自定义域名

1. 购买一个域名（我用的阿里云，买最便宜的域名）

2. 设置解析域名如下：

   

   • A 对应ip是通过 ping yourUserName.github.io 获得的 ipv4
   • CNAME 对应 yourUserName.github.io

3. 进入github yourUserName.github.io工程 Settings页面，找到Pages选项

   

   • 等待一会就可以在自己的域名访问了
   • 配置好之后github会在gh-pages分支下自动生成CNAME文件（moyuderen.fun）
   • 该工程配置好之后，别的工程路由无需配置就可自动访问 eg: https://moyuderen.fun/chanzhongshuochan

配置

主题

该博客使用的是fluid主题