目录
- 前言
- 环境
- hexo 更换主题
- 解决部署到 Github Page 后无 CSS 样式的问题
前言
最近更换了 hexo 的主题后，重新部署到 Github Page 上发现不显示 CSS 样式，但在本地启动时又是正常的效果。此外，检查资源请求，发现多个 .css 文件请求 404，判断可能部署后路径除了问题。
本文先讲一下如何更换主题，然后讲一下如何修改路径，让样式能够被正确请求。
环境
hexo 版本：7.2.0
hexo 更换主题
第一，进入 hexo 目录下的 theme文件夹，通过 git clone的方式下载目标主题到 theme文件夹中（目标主题的链接如下图所示），例如
git clone https://github.com/HCLonely/hexo-theme-webstack.git
此外，也可以通过下载 release 等方式获取目标主题。
完成上述步骤后，会在你的 theme文件夹内下载好需要的目标主题，其中目录的结构如下图所示。
在这里，主题所在目录的名称可以更改，例如上图左图中，我将原始的目录名字 hexo-theme-webstack更改为了 webstack。
第二，修改 hexo 根目录下 _config.yml配置文件中的主题配置，如下所示我注释了默认的 landscape主题，并修改为了 webstack主题：
# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
# theme: landscape
theme: webstack
第三，至此，主题就切换完成了。而对主题本身的配置则根据相应主题的官方文档，对 hexo 根目录下的 _config.XXX.yml文件进行修改（XXX 即目标主题的名字，如 hexo 默认的 _config.landscape.yml），这里就不展开了。
解决部署到 Github Page 后无 CSS 样式的问题
方法很简单，在 hexo 根目录下 _config.yml配置文件中，找到对 URL 部分的配置，其他配置选项不动，仅修改 url 选项，如下：
# URL
## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project'
url: https://eternaldeath.github.io/你的仓库名/
- url 放置完整的路径，如果你是在 Github Page 上部署自己的博客，那么则无需添加“你的仓库名”部分，如果你是对某个仓库创建的 Github Page，则需要加上你的仓库名
【注】我观察到一些教程还要求修改 root 选项，然而在我的 hexo 版本（7.2.0）中并无 root 选项，且上述步骤在仅修改 url 的情况下也可以实现
【注】如何查看你的 hexo 版本：进入你的 hexo 根目录，在命令提示符（power shell 无效）下输入 hexo version，找到下图所示字段即可
然后再重新执行如下指令，即可产生效果
hexo clean
hexo g
hexo d # 部署至上线，如 Github Page
