网站更新小记

Hi Guys,

好久不见！为了更好沉淀自己，我要回归 blog 日常更新了。

小站最近主要变化：

• 切换新 hexo 主题
• 改变工作流
  • md 文件托管在 dev
  • html 静态网页部署在 master
  • 增加 hexo admin 管理功能

下面分别细说下

主题更新

原来的主题 hexo-theme-skapp 扁平风格一直很喜欢，但使用的插件版本过低，且没有lazy 加载功能，网站性能较差，所以调研选择一个 github 开源的fluid 主题（https://github.com/fluid-dev/hexo-theme-fluid）

工作流切换

老的工作流：

1. 本地编译 markdown 修改预览，hexo server 本地预览
2. hexo generate -d 生成部署到 github pages 的master 分支
3. 重复1、2操作

工作流没问题，但有一个不便之处就是 markdown 都在本地，容易丢失，不支持云编辑

新的工作流：

1. 本地编译 markdown 修改预览，hexo server 本地预览 / hexo admin 创建（本篇就是使用的 hexo admin ）
2. git add . ; git commit -m “do something”; git push
3. hexo generate -d 生成部署到 github pages 的master 分支

要改变Hexo部署的工作流程以满足需求，我的具体步骤如下：

1. 创建并切换到dev分支：在本地克隆的Hexo仓库中，使用Git命令创建一个名为dev的新分支，并切换到该分支。

git checkout -b dev

2. 配置Hexo的_source目录：在Hexo配置文件（_config.yml）中，将source_dir的值设置为dev，这将使Hexo在dev分支上查找源文件。

source_dir: dev

3. 配置Hexo的部署设置：在Hexo配置文件中，将deploy的类型设置为git，并将branch设置为master，这将告诉Hexo将生成的站点部署到GitHub Pages的master分支。

deploy:
  type: git
  repo: <GitHub仓库地址>
  branch: master

4. 提交并推送dev分支：将本地编辑完毕的Markdown文件和资源文件提交到dev分支，并将该分支推送到GitHub仓库。

git add .
git commit -m "Update content"
git push origin dev

5. 生成并部署站点：运行Hexo生成并部署命令，这将根据dev分支上的源文件生成站点，并将生成的站点文件部署到GitHub Pages的master分支。

hexo generate -d

通过以上步骤，可以实现本地编辑完毕后将原始Markdown文件和资源文件推送到GitHub Pages仓库的dev分支，然后自动进行Hexo生成和部署到master分支。需要注意是，你要确保在执行Hexo部署命令之前已经提交了对源文件的更改，并且已经配置了正确的GitHub仓库地址。

Hexo Admin

要为Hexo添加后台管理界面以编辑博客文章，可以使用一些Hexo的插件或工具来实现。其中一个常用的选择是使用 Hexo Admin 插件。

以下是使用Hexo Admin插件添加后台管理界面的基本步骤：

1. 安装Hexo Admin插件：

   • 打开命令行工具，并导航到您的Hexo博客根目录。
   • 运行以下命令来安装Hexo Admin插件：npm install --save hexo-admin。

2. 配置Hexo Admin插件：

   • 在Hexo博客根目录的_config.yml文件中，添加以下配置：

     hexo_admin:
       username: admin
       password_hash: # 通过运行 `echo -n 'your_password' | openssl sha1` 命令生成密码的哈希值

3. 启动Hexo服务器并访问管理界面：

   • 运行hexo server命令启动Hexo服务器。
   • 打开Web浏览器，并访问http://localhost:4000/admin来访问Hexo Admin的管理界面。

通过 hexo admin 界面，我们就可以轻松实现登录并管理博客文章，包括创建新文章、编辑现有文章、预览和发布等。

安装和配置Hexo Admin插件后，需要在访问管理界面之前登录使用预先设置的用户名和密码。确保将用户名和密码配置为安全且不易猜测的值。

另外，还有其他一些Hexo插件和工具可用于添加后台管理界面，例如Netlify CMS、Admino、Easymotion等。您可以根据个人喜好和需求选择适合您的插件来增强Hexo的管理功能。

made with ChatGPT ♥