Github博客搭建

安装

安装 gitnvs

设置 nvs 环境变量

详细参考:https://www.cnblogs.com/hackyo/p/8110951.html

新建一个系统变量

NODE_HOME
C:\Program Files\nodejs

在系统变量的 Path 变量中添加两个条目

%NODE_HOME%
%NODE_HOME%\node_global

测试是否成功设置

node -v
npm -v

安装 hexo:npm i -g hexo

测试 hexo 是否成功安装:hexo -v

选择存放文件的目录初始化 hexo:hexo init

初始化后目录下会出现以下文件夹

node_modules	#  依赖包
scaffolds		#  模板
source			#  文章、草稿(_drafts)、稿件(_posts)
themes			#  主题
public			#  静态页面
_config.yml		#  配置文件
db.json			#  source 解析所得到的
package.json	#  项目所需模块项目的配置信息

hexo 常用命令

详细参考:https://hexo.io/zh-cn/docs/commands

#  清楚缓存文件
hexo clean

#  生成静态文件
hexo generate

#  开启本地预览服务器(访问网址为: http://localhost:4000/,可用 -p 指定端口)
hexo server

#  部署之前预先生成的静态文件
hexo deploy

更改主题

推荐主题:butterflyMaterystunBeanTechnext

下载好 主题 后将文件解压并移动到 themes 文件夹下

然后将 _config.yml 文件中的 theme: landscape 更改为 theme: butterfly-3.6.2 (冒号后面的名字需和 themes 文件夹下的主题文件夹名字一致)

然后再次执行如下命令在本地查看效果

hexo clean && hexo generate && hexo server

如启动服务后显示 extends includes/layout.pug block content include 字符则在 cmd 执行如下命令(需在博客跟目录执行)

npm install --save hexo-renderer-jade hexo-generator-feed hexo-generator-sitemap hexo-browsersync hexo-generator-archive

然后再次执行如下命令在本地查看效果

hexo clean && hexo generate && hexo server

详细配置参考(这里我选的是 butterfly 主题):https://butterfly.js.org/posts/21cfbf15/

需安装(需在博客跟目录执行)

npm install hexo-renderer-pug hexo-renderer-stylus --save
npm install hexo-generator-search --save
npm install hexo-generator-searchdb --save

创建分类

hexo new page categories

创建完后会在 source\categories 目录下生成 index.md 文件

默认内容如下

---
title: categories
date: 2021-02-10 10:20:20
---

修改为

---
title: 分类
date: 2021-02-10 10:20:20
type: "categories"
---

创建标签

hexo new page tags

创建完后会在 source\tags 目录下生成 index.md 文件

默认内容为

---
title: tags
date: 2021-02-10 10:20:20
---

修改为

---
title: 标签
date: 2021-02-10 10:20:20
type: tags
---

设置博客分类及标签

md 格式的文件最前面插入

---
title: test
date: 2021-02-10 14:48:07
tags:
	- 测试
	- hexo
categories: test
---

插入图片

md 文件的位置创建一个相同名字的文件夹,然后在文件夹内存放图片(导入图片时直接输入图片名字即可,否则不会显示图片如:![](test.jpg)

如加载不了 md 文件内引用的本地图片则安装

npm install https://github.com/7ym0n/hexo-asset-image --save

修改 _config.yml 文件

post_asset_folder: true

上传到 Github

生成 ssh 密钥

ssh-keygen -t rsa -b 4096 -C "your_email@example.com"

github 导入密钥,参考:https://jingyan.baidu.com/article/fc07f989b13ec912ffe51914.html

导入完密钥后在 _config.yml 文件尾部修改

deploy:
  type: git
  repo: git@github.com:gihub的名字/gihub的名字.github.io.git
  branch: master

然后使用 Git Bash 运行

#  先进入博客跟目录然后运行如下命令
cd D:\博客主目录
npm un hexo-deployer-git
npm i hexojs/hexo-deployer-git
hexo clean && hexo g
hexo d

上传时需要输入创建密钥时设置的密码

上一篇:使用hexo和GitHub搭建个人博客(详细)


下一篇:Hexo+Github/Gitee搭建网站