网上教程已经很多了。为什么还要写这样一篇博客呢?
网上教程过于分散,自己在搭建过程中遇到了一些细节问题,从头到尾解决下来花了不少时间,本文重点是涉及配置hexo安装环境和git环境,希望做一个总结,方便日后查看,也许能够帮到更多人呢~
说明:Hexo是静态博客生成框架,这个博客要托管在开源代码托管网站Github的git pages上,git
是Github的分布式源代码管理工具,这里用来推送hexo博客文件到github,我们只需要简单的了解node js
是一个Java script运行环境,hexo的运行需要这个环境的支撑即可,npm
是nodejs
的模块管理器,可以用来方便地安装所需hexo模块。)
1. 本地设置:
1.1 配置Hexo安装环境 (git
,nodejs
和npm
)
(说明:Hexo是静态博客生成框架,这个博客要托管在开源代码托管网站Github的git pages上,git
是Github的分布式源代码管理工具,这里用来推送hexo博客文件到github,我们只需要简单的了解node js
是一个Java script运行环境,hexo的运行需要这个环境的支撑即可,npm
是nodejs
的模块管理器,可以用来方便地安装所需hexo模块。)
1.1.1 安装nodejs
和npm
#如果是Debian系的(如Ubuntu)
sudo apt-get install nodejs npm
#如果是Archlinux
sudo pacman -S nodejs npm
1.1.2 配置环境变量
npm config set prefix ~/.npm
export PATH="$PATH:$HOME/.npm/bin"
echo export PATH="$PATH:$HOME/.npm/bin" >> ~/.zshrc # 持久化环境变量配置
echo export PATH="$PATH:$HOME/.npm/bin" >> ~/.bashrc
1.1.3 配置git
首先安装好git,然后执行如下命令配置git环境:
git config --global user.name "arisskz6"
git config --global user.email arisstz6@gmail.com
1.2 安装Hexo
npm install hexo-cli -g
npm install
npm install hexo-deployer-git
2. 远程设置
2.1 配置Github pages
感谢知乎@CrazyMilk
在github上创建博客仓库,名称形式是这样:arisskz6.github.io
- 创建仓库 arisskz6.github.io;
- 创建两个分支:master 与 hexo;
- 设置hexo为默认分支(因为我们只需要手动管理这个分支上的Hexo网站文件);
- 使用git clone git@github.com:arisskz6/arisskz6.github.io.git拷贝仓库;
- 在本地https://arisskz6.github.io文件夹下通过Git bash依次执行npm install hexo、hexo init、npm install 和 npm install hexo-deployer-git(此时当前分支应显示为hexo);
- 修改_config.yml中的deploy参数,分支应为master;
- 依次执行git add .、git commit -m “…”、git push origin hexo提交网站相关的文件;
- 执行hexo g -d生成网站并部署到GitHub上。
直通车: 点我
2.2 本地与git pages连接
2.2.1 判断本地ssh key是否已存在
ls -al ~/.ssh
显示结果如下:
arisskz6 in ~/Documents λ ls -al ~/.ssh
总用量 20
drwx------ 2 arisskz6 users 4096 11月 24 20:29 .
drwx------ 29 arisskz6 users 4096 12月 13 16:11 ..
-rw------- 1 arisskz6 users 1679 11月 24 20:29 id_rsa
-rw-r--r-- 1 arisskz6 users 400 11月 24 20:29 id_rsa.pub
-rw-r--r-- 1 arisskz6 users 988 11月 24 21:25 known_hosts
上面结果中的4、5两行就分别是ssh key的私钥和公钥,我这里已经存在,如果没有,就要生成ssh key了
使用如下命令生成ssh密钥对:
ssh-keygen -t rsa -b 4096 -C "arisstz6@gmail.com"
会回答几个问题,如果没有特别需求,一路按回车键选择默认选项即可。
2.2.2 将ssh key添加到ssh-agent中
eval "$(ssh-agent -s)" #启动ssh-agent后台程序
ssh-add ~/.ssh/id_rsa #添加ssh密钥到ssh-agent
2.2.3 将本地ssh密钥对中的公钥添加到github
cat ~/.ssh/id_rsa.pub
将显示出的ssh公钥内容复制到剪贴板,在gituhb个人页面中点击头像,然后点击Settings,在Personal settings边栏中点击SSH and GPG keys,点击New SSH key(或Add SSH key),设置自己喜欢的标题,把公钥粘贴进下方空白区域即可
2.2.4 测试ssh连通性
ssh -T git@github.com
如果显示如下就成功了:
arisskz6 in ~/Documents λ ssh -T git@github.com
Hi arisskz6! You've successfully authenticated, but GitHub does not provide shell access.
我们配置ssh key目的就是不用每次提交博客都输入账号密码,前面的铺垫打完了,下面就要在站点配置文件中进行相应的设置
2.3 修改Hexo站点和主题文件
2.3.1 创建配置文件的备份,方便以后出现问题恢复
cd ~/Documents/hexo
cp _config.yml _config.yml.bak
2.3.2 首先修改_config.yml
中的deploy
属性
deploy:
type: git
repo: git@github.com:arisskz6/arisskz6.github.io.git
branch: master
2.3.3 安装next
主题
mkdir themes/next
curl -L https://api.github.com/repos/iissnan/hexo-theme-next/tarball | tar -zxv -C themes/next --strip-components=1
2.3.4 配置next主题
2.3.4.1 首先修改hexo根目录下的站点配置文件_config.yml
- 设置网站标题
title: arisskz6's Blog
subtitle: 不忘初心
- 设置语言为中文:
language: zh-Hans
- 设置时区(重要!!!如果不设置会出现问题,以后我们会专门写一篇博文来总结hexo配置中的那些坑)
timezone: Asia/Shanghai
- 启用next主题
themes: next
- 添加网站url
url: https://arisskz6.github.io/
- 添加disqus评论支持
disqus_shortname: arisstz6
- 添加一个标签页,里面包含网站中的所有标签
- 创建一个名为
tags
页面 - 编辑标签页, 设置页面类型为tags
- 添加 tags 到主题配置文件
_config.yml
里
hexo new page "tags"
title: All tags
date: 2014-12-22 12:39:04
type: "tags"
------
menu:
home: /
archives: /archives
tags: /tags
站点配置文件中其他项可酌情自行设置,除非了解要修改项的含义,否则不要随意改动
3. hexo常用命令
- 新建文章:
hexo new "文章标题"
- 更新hexo配置
hexo clean
- 将写好的makdown格式的博文生成为html文件
hexo g
- 本地预览博客
hexo s
- 本地调试博客
hexo s --debug
- 推送博客到git pages
hexo d
更新博客时上面两个命令可以合用:
hexo g -d
4. 换电脑或重装系统后更新博客
- 使用形如
git clone git@github.com:arisskz6/arisskz6.github.io.git
的git命令拷贝仓库(默认分支为hexo) - 在本地新拷贝的
arisskz6.github.io
目录下执行如下命令在持久化保存用户名和密码(以后提交就不用每次都输入用户名和密码了):
git config credential.helper store
- 依次执行下列指令:
npm install hexo
npm install
npm install hexo-deployer-git # 记得,不需要hexo init这条指令
5. 配置独立域名
两位大神已经给出了详细的教程,我不会说是我懒癌犯了,参考链接(感谢^^):
1.无人看的冷清博客:Hexo-Github-Pages-Cloudflare搭建自定义域名HTTPS博客
2.MARKSZのBlog:hexo持久化构建以及给自有域名github-page上HTTPS