快速安装 Hexo 静态网站并部署到 GitHub Pages

date
Dec 18, 2020
slug
hexo-install-deploy
status
Published
tags
GitHub Actions
GitHub Pages
Hexo
域名解析
summary
Hexo 是一个非常强大的静态网站系统。配合丰富多样的主题,可以非常方便的搭建博客或个人网站。借助 GitHub Pages,Cloudflare Wokersite/Pages 等提供的托管服务,我们无需任何服务器资源就能拥有展示和记录自己的一片空间。
type
Post
Hexo 是一个非常强大的静态网站系统。配合丰富多样的主题,可以非常方便的搭建博客或个人网站。借助 GitHub Pages,Cloudflare Wokersite/Pages 等提供的托管服务,我们无需任何服务器资源就能拥有展示和记录自己的一片空间。
本文默认您已懂得域名解析和简单的 GitHub 操作。

安装

安装本地环境

  1. 下载安装 Node.js
  1. 下载安装 gitshell

安装 Hexo

安装非常简单。
新建一个用于存放网站的文件夹,在文件夹中右击,选择在 git bash 中运行:
当然你也可以通过系统自带命令行工具,如 Windows 系统在 CMD 中通过 cd C:\desktop\hexo 来到这个文件夹并运行以上命令。

初始化 Hexo

  1. 直接运行初始化命令:
    1. 安装组件:
      1. 清除缓存:
        1. 生成网站:
          1. 部署到本地服务器:
            在浏览器输入地址 localhost:4000 ,你应该可以看到范例网站了。

            配置文件

            注意,Hexo 5.0 的主题安装以及主题配置文件有所更新,但向下兼容,所以仍支持以下方法。感兴趣可以查看这篇文章:Hexo 5.0.0 正式发布
            你可以到官方主题站找到喜欢的主题:Themes ,下载即可。
            Hexo 网站有两个 _config.yml 配置文件。
            1. 一个在 Hexo 文件夹根目录,这是站点配置文件,用于配置网站名称,url 和部署网站等;
              1. notion image
            1. 另一个在 themes 主题文件夹的每个主题内,你找到的主题放在这个 themes 文件夹即可(同时在上述 _config.yml 配置文件的 theme: 字段填写主题文件夹名)。这个配置文件包含目录结构,评论和访问统计等具体细节内容。
              1. notion image

            部署

            配合主题文档,在配置文件内修改相关内容。在 source/_posts 文件夹内新建 .md 格式的 Markdown 文档并创作。
            接着生成内容,预览。
            确认好后即可部署到远程服务器。

            这里以 GitHub Pages 为例。

            你网站的全部内容都在 public 文件夹内,只需将这里的内容放在 GitHub 仓库,剩下的交给 GitHub 即可。
            具体可以用:
            • GitHub 客户端(没记错网页一次只能上传 100 个文件),直接将生成的网站,即 public 文件夹的内容同步到 GitHub 仓库;
            • 也可以通过 Github Actions 实现自动部署(推荐),方法稍后补上;
            • 如果你是命令行大佬,也可以使用 git 命令: 这时会要求您输入密码等信息,您也可以通过生成密钥的方式省去每次输密码的麻烦。具体操作这里不再介绍。
                1. 在文件夹内右击,git bash 或其它命令行工具中运行如下命令,保存你的 GitHub 账户信息。
                  1. 在站点配置文件中的最后填写 GitHub 路径信息
                    1. 推送到仓库

                  个性化/访问

                  访问 你的 GitHub 用户名.github.io 就可以访问网站了。
                  你也可以在 GitHub 对应仓库的设置(Settings)→ GitHub Pages 部分绑定自己的域名(别忘了域名解析,比如添加一个 cname 将域名解析到 你的用户名.github.io )。再在 source 文件夹内新建一个名为 CNAME (没有后缀)的文件,并写入你的域名。
                  你也可以在 DNS 服务里添加 A 类解析,将域名解析到:
                  另外,GitHub Pages 可以直接开启 https 访问,别忘了开启(有时要等一会儿才给开),同时在上面的 CNAME 文件中将域名改成 https://域名,实现强制跳转。
                  notion image
                  最后,欢迎来 Telegram 交流:https://t.me/daiseax
                  Enjoy!
                   
                  💡
                  This article is licensed under CC BY-NC-SA 4.0. All rights to the work belong to the author. For commercial use, please contact the author for permission. For non-commercial use, please provide attribution to the source.
                  Author: Dukewill Source: blog.daisea.com

                  © Dukewill 1989 - 2024