1. 工具

  • Git
  • Node.js
  • Hexo
  • Github
  • Netlify

2. Hexo 安装&搭建

  1. 在自己想要的位置新建一个博客文件夹，然后在根目录，右键 Git Bash Here

  2. 使用命令安装 Hexo

    1
    $ npm install hexo-cli -g

  3. 安装完成后，使用 hexo -v 查看版本信息

    1
    $ hexo -v

  4. 使用 hexo init 初始化 Hexo

    1
    $ hexo init

  5. 使用 hexo generate 或缩写 hexo g生成静态页面

    1
    $ hexo g

    生成的资源会存放到 public 文件夹中

  6. 使用 hexo server 或缩写 hexo s 启动服务

  7. 浏览器访问 http://localhost:4000 ，就能在本地看到默认主题的博客了

一些文件、文件夹的解释

1
2
3
4
5
6
7
8
9
10
Root
  |--- node_moudules // 依赖包
  |--- public // 生成的资源
  |--- scaffolds // 模板
  |--- source // 源码
        |--- _posts // 文章
        |--- _drafts // 草稿
  |--- themes // 主题
  |--- _config.yml // Hexo 默认配置文件
  |--- package.json // 项目所需模板配置信息

3.1 部署方法一：GitHub Pages

  1. GitHub 新建一个公开仓库，仓库名必须是 你的用户名.github.io

  2. 修改 _config.yml 中找到 deploy，修改如下

    1
    2
    3
    4
    deploy:
      type: git
      repo: git@github.com:你的用户名/你的用户名.github.io.git
      branch: main

  3. 根目录 Git Bash，然后分别执行以下命令

    1
    2
    3
    4
    $ npm install hexo-deployer-git --save // 安装部署工具
    $ hexo clean // 清除缓存
    $ hexo g // 生成静态文件
    $ hexo d // 部署到 GitHub

  4. 浏览器访问 https://你的用户名.github.io 就可以在线访问了

3.2 部署方法二：Netlify（推荐）

这种方法访问快，而且仓库可以私有化，仓库名不固定

  1. 首先需要新建一个仓库，推荐私有仓库，仓库名自定义（这里我直接将上边 Hexo 部署到 GitHub 的仓库拿过来用了）

  2. 登录 Netlify，new site，然后链接 GitHub

  3. 选择要部署到 Netlify 上的博客仓库，然后 Deploy 即可

4. Netlify 绑定域名，设置 DNS

这里以阿里云为例

  1. 点击部署的博客项目，找到 Domain management，添加自己的域名
  2. 回到阿里云，进行域名解析。记录类型：CNAME，主机记录：www，记录值填 Production domains 中第一个 xxx.netlify.app 即可
  3. 设置 DNS
  4. 根据提示，在域名控制台修改 DNS 服务器

5. 设置 HTTPS

还是在之前的 Domain management，找到 HTTPS，然后 Verify 一下，稍等几分钟，链接不安全的提示就没有咯~