本期教大家如何搭建 Hexo
首先需要准备的东西如下:
1.电脑
2.手
3.脑袋
好了没了
由于 Hexo 这款博客程序是基于 Node.js 所构建的,所以我们需要下载 Node.js
选择下载稳定版(LTS):12.18.3
下载并安装完成后验证是否安装好了的方法
打开终端
输入 node -v 和 npm -v
如果出现版本号 v….就说明安装成功
使用 Hexo 呢 Git 也是必不可少的
打开Git 官网
点击 Donload 2.28.0 for Windows 即可进行下载
但由于是使用 GitHub 的 release 进行下载所以速度较慢
国内用户可以使用:淘宝镜像源进行下载,最新版本需要翻到最底下进行下载
安装好后在桌面单击右键,如果右键菜单出现
Git Bash Here 的字眼则代表安装成功
新建一个文件夹,在里面右键
选择 Git Bash Here 打开 Git 终端
输入
npm install hexo-cli -g
安装 Hexo-cli
安装好后输入
hexo init
来初始化 Hexo,此步骤会从 GitHub 下载 Hexo 的主题、依赖文件所以时间会比较久,请耐心等待哦 o( ̄ ▽  ̄)ブ如果你有条件就访问外国网站吧~
当提示 INFO Start blogging with Hexo!时就安装完成了
查看安装的文件夹
发现有这些文件/文件夹:
其中 node_modules 是你安装的插件存放位置,删掉了必须重新 npm i
scaffolds 是你博客的模板存储位置,page.md 就是创建 page 时使用什么模板以此类推就行
source 是用来存放博客资源的,一般都是随手扔文件进去就行
.gitignore 目前用不到(除了使用 GitHub actions 等持续集成部署博客的)
_config.yml 用来存放 Hexo 配置
package.json 顾名思义,就是你安装的插件名称和版本都会被存储在里面
其中我们要用到的是 themes、_config.yml
首先我们去Hexo 官方主题网站找一个好看的主题
这边用 Butterfly 为例
点击它的图片进去看看效果
个人觉得还行,目前我正在用,体验也非常好
这款主题的 GitHub 仓库为https://github.com/jerryc127/hexo-theme-butterfly
进入后在 README.md 中有 2 种安装方法
1.使用普通安装方法(git clone)
2.使用 NPM 安装(npm install hexo-theme-butterfly)
这边用 GIT 做演示
复制指令
在终端内部粘贴并回车
安装完成后根据 GitHub 仓库的 README.md 提示还需要安装 pug&stylus 渲染器
指令如下:
npm install hexo-renderer-pug hexo-renderer-stylus
安装依赖完成后我们打开_config.yml
找到 theme:
把它改为 Butterfly
保存文件,然后在终端执行
hexo s
打开 Hexo 的本地预览工具看看效果
默认的打开地址是:http://localhost4000
用户可通过 hexo s -p 来指定访问端口
比如 2000
1080
8081 等
Hexo 安装完成后默认的名称为 Hexo,那么如何更改呢
首先打开_config.yml
找到”# Site”
更改 title subtitle description keywords author
title 更改为您的博客名字
subtitle 更改为你的介绍
keywords 更改为你想要的关键字
author 更改为你自己的名字
一切准备完成后就可以部署了
这边演示 Coding 部署
双部署也一样
首先打开Coding 官网
如果没有账号就点击免费注册
注册完成进入你的企业
选择创建项目
项目模板使用 DevOps
名称可以随意
例如:👴 的博客等
这边用 👴 的博客示范
启用 README.md 初始化可以随意
公开源代码可以自选
配置完后点击完成创建
接下来进入持续部署-静态网站
进行实名认证
认证完成后点击立即发布静态网站
网站名称依旧随便填写
其他配置不要动
点击完成创建
这时候出现这个页面
选择设置
下滑找到自定义域名
复制用以代替 xxxx.coding-pages.com 作为网站的访问地址的 xxxx.coding-pages.com
然后打开 DNS 解析商
这边使用 dns.la
新建一个解析
解析设置:
其中主机记录可以自行设置
比如 www
test
cna 等
如果要直接用域名访问主机记录留空
做好解析之后回到 Coding 页面
添加刚才的域名
这边使用 test.slqwq.cn 做示范
这时候会出现这样的样子
这是在生成证书
证书状态变为正常后推荐打开强制 HTTPS
这些做完后打开_config.yml 找到 deploy 配置
里面这样填写
deploy:
type: git
repo: https://e.coding.net/企业名/项目名/仓库名.git
branch: master
填写完后在终端内输入
npm install hexo-deployer-git --save
安装 Hexo-Deployer-Git
安装完后就可以使用
hexo clean && hexo d -g
部署了
结束了~
感谢您的观看
更多进阶功能可前往Hexo 文档和Butterfly 主题文档查看