目录
- 前言
- 环境
- hexo 更换主题
- 解决部署到 Github Page 后无 CSS 样式的问题
前言
最近更换了 hexo 的主题后，重新部署到 Github Page 上发现不显示 CSS 样式，但在本地启动时又是正常的效果。此外，检查资源请求，发现多个 .css 文件请求 404，判断可能部署后路径除了问题。
本文先讲一下如何更换主题，然后讲一下如何修改路径，让样式能够被正确请求。
环境
hexo 版本：7.2.0
hexo 更换主题
第一，进入 hexo 目录下的 theme文件夹，通过 git clone的方式下载目标主题，例如
git clone https://github.com/HCLonely/hexo-theme-webstack.git
完成上述步骤后，会在你的 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
第三，至此，主题就切换完成了。而对主题本身的配置则根据相应主题的官方文档，对_config.XXX.yml文件进行修改，这里就不展开了。
解决部署到 Github Page 后无 CSS 样式的问题
方法很简单，在 hexo 根目录下 _config.yml配置文件中，找到对 URL 部分的配置，其他配置选项不动，仅修改 url 和 root 两个选项，如下：
# 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，则需要加上你的仓库名
然后再重新执行如下指令，即可产生效果
hexo clean
hexo g
hexo d
