Hexo+Github搭建博客

  • 花费了将近十个小时,查阅了上百篇资料,终于搭建好了自己的第一个博客,就以这第一篇博客纪念我走过的坑 预览网站
  • 2023.0218:补充更新内容

一、注册GitHub

Github官网创建账户登录之后,新建一个名称为账户名.github.io的代码仓库,可以通过http://<username>.github.io来访问你的个人主页

二、安装基础环境

2.1 Linux

Linux版本太过久远,现在命令可能变化了

环境

  • 系统版本:Ubuntu 17.04

安装Git

使用以下命令

1
$ sudo apt-get install git

检查版本

1
$ git --version

安装Node.js

  • 可以选择从官网的源码安装
  • 从NodeSource安装
1
2
3
4
5
# 以 sudo 用户身份运行下面的命令,下载并执行 NodeSource 安装脚本
$ curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash -

# 安装 Node.js
sudo apt install nodejs

检查版本

1
$ node -v

安装npm

执行命令:

1
$ sudo apt-get install npm

2.2 Window

Window上使用powershell作为终端环境

nvm

window上使用nvm来管理nodejs的版本

主要命令:

1
2
3
4
5
6
7
8
9
# 安装指定版本的nosdejs
nvm install v12.14
# 使用指定版本的nodejs
nvm use v12.14
# 列出所有版本的nodejs(前边带 * 的是当前正在使用的)
nvm list

# 其它命令使用方法如下命令查看
nvm /?

nodejs安装好之后,npm也自动一并安装了

三、Hexo配置

安装hexo

安装命令:

1
$ npm install hexo-cli -g

博客初始化根目录:

1
$ hexo init #初始化博客所在根目录

一些常用命令:

1
2
$ hexo g #或者hexo generate //生成静态页面
$ hexo s #或者hexo server 本地查看

打开http://localhost:4000/已经可以看到一篇内置的blog了

1
2
3
$ hexo d #或者hexo deploy //部署博客到远程
$ hexo new "postName" #新建文章
$ hexo new page "pageName" #新建页面

本地查看hexo s命令可能出现错误,使用如下命令可以解决

1
$ hexo s -s

更换主题(eg:yilia)

1
2
$ cd /blog/themes #切换到主题目录
$ git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia #克隆主题到本地,可以在github上搜索主题,替换相应链接就可以了

修改Hexo目录下的_config.yml配置文件中的theme属性,将其设置为yilia(根据主题名称设定)

使用hexo deploy部署

如将代码部署到github,在配置文件 _config.xml中作如下修改:

1
2
3
4
deploy:
type: git
repo: git@github.com:<**yourname>**/<**yourname>**.github.io.git
branch: master

使用如下命令,即可完成部署,即可在github上创建的仓库里看到代码

1
$ hexo d

该处需要安装一个拓展

1
$ npm install hexo-deployer-git --save

绑定域名

source目录下新建一个名为CNAME的文件,文件内填域名即可

参考

参考链接: - 令狐葱@前端笔记