背景
为了搭建个人在GitHub上的博客,看了几个帖子,方便自己后续使用,记录下自己搭建的过程,整合成一个帖子。
一、安装环境 & 流程步骤
1.安装环境
- 搭建node.js环境
- 搭建git环境 和 搭建Github个人仓库
- 搭建本地hexo
2.发布博客
- 将hexo和GitHub Pages关联起来
- 编写md文档,并且用hexo操作发布
二、环境搭建和操作
1. 安装node.js
如果node之前安装过,没卸载干净,那么输入如下,可以清理干净:
1 2 3 4 5 6 | sudo npm uninstall npm -g sudo rm -rf /usr/local/lib/node /usr/local/lib/node_modules /var/db/receipts/org.nodejs.* sudo rm -rf /usr/local/include/node /Users/$USER/.npm sudo rm /usr/local/bin/node sudo rm /usr/local/share/man/man1/node.1 sudo rm /usr/local/lib/dtrace/node.d |
确认是否卸载干净:
1 2 | node -v //not found npm -v //not found |
1> 下载安装包直接安装node
Node.js下载地址:Node.js下载安装包,注意安装Node.js会包含环境变量及npm的安装。
安装后,检测Node.js是否安装成功,在命令行中输入 node -v ;
检测npm是否安装成功,在命令行中输入npm -v 。
2> 通过brew安装node
安装homebrew
首先输入指令: /usr/bin/ruby -e “$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
如果homebrew安装报错,如图:
解决方法 输入:brew doctor 修复 brew
安装node和npm
安装命令:
1 2 | brew install node brew install npm |
如果输入 brew install node 时,出现如图错误:
解决方法:
- 输入:sudo chown -R
whoami
/usr/local/ - 输入:brew link –overwrite node
- 输入:brew link node
这样 homebrew 就和 node 链接到一起了
2.安装git
这里需要通过Git将本地的Hexo生成的网页代码push到GitHub上。
1> 下载安装git
从Git官网下载:Git - Downloading Package 现在的机子基本都是64位的,选择64位的安装包,下载后安装,在命令行里输入git测试是否安装成功,若安装失败,参看其他详细的Git安装教程。
2> git和Github账号绑定
安装成功后,将你的Git与GitHub帐号绑定
1 2 | git config --global user.name "你的GitHub用户名" git config --global user.email "你的GitHub注册邮箱" |
生成ssh密钥文件:
1 | ssh-keygen -t rsa -C "你的GitHub注册邮箱" |
然后直接三个回车即可,默认不需要设置密码。
然后找到生成的.ssh的文件夹中的id_rsa.pub密钥,将内容全部复制,打开GitHub_Settings_keys 页面,新建new SSH Key。
如上图,Title为标题,任意填即可,将刚刚复制的id_rsa.pub内容粘贴进去,最后点击Add SSH key。
在Git Bash中检测GitHub公钥设置是否成功,输入
1 | ssh git@github.com |
3> 创建GitHub个人仓库主页
先去GitHub官网注册Git账户
注册之后,新建一个repository(仓库)为Github Pages的仓库
Github Pages仓库命名规范是: yourname.github.io
记住:名字好好起,如果以后你自己舍不得花钱买域名,那你主页的域名就是:yourname.github.io
3. 安装hexo
-
先创建一个文件夹Blog,后面hexo框架和本地写的文章都会在这个文件夹下。
-
使用npm命令安装Hexo
1 | sudo npm install -g hexo-cli |
- 进入blog目录(Blog里面一层)后面的指令都必须在这个目录以内才能找到。
1 | cd blog |
- 检查hexo 是否安装成功
1 | hexo |
- hexo安装成功,初始化博客
1 | hexo init blog |
- 测试下博客主页的基本框架OK没
1 2 3 | hexo new test_my_site hexo g hexo s |
- 以上指令分别是:新建一篇博客,生成,启动本地服务
所以可以在浏览器中本地查看
1 2 3 | localhost:4000 //关闭服务器 control + C |
- 如果 hexo s 报错,ERROR Server not found: git
1 | npm install hexo -server --save |
其他的指令同理,比如 hexo deployer 也没有,那就:
1 | npm install hexo -deployer --save |
4. 环境配置—hexo和GitHub关联起来
前面提到的博客所在根目录blog,其目录结构:
其中有个配置文件:_config.yml
。打开_config.yml
文件,找到Deployment
,然后按照如下修改,用户名改成你的,git地址改成你的。
注意冒号:
后面要空一格
1 2 3 4 5 6 | # Deployment ## Docs: https://hexo.io/docs/deployment.html deploy: type: git repo: git@github.com:yourname/yourname.github.io.git branch: master |
themes文件夹,里面也有个_config.yml文件,这个称为主题配置文件。后面想下载别的主题使用,就会用到。
更换主题
如果你不喜欢Hexo默认的主题,可以更换不同的主题,主题下载:Themes 。复制喜欢的主题的git地址,进入blog目录(就是命令行的位置处于blog目录)打开命令行输入:
1 | git clone https://github.com/dongyuanxin/theme-ad.git themes/yourtheme |
这是将XX主题下载到blog目录的themes主题下的yourtheme文件夹中。打开站点的_config.yml配置文件,修改主题为yourtheme
1 2 3 4 | # Extensions ## Plugins: https://hexo.io/plugins/ ## Themes: https://hexo.io/themes/ theme: yourtheme |
如上操作,主题就更改好了。不过有的源码是需要插件的, 源码的博客都会在git上注明的,照着操作就好。记得学会hexo s 本地启动服务游览:http://localhost:4000/> 。
5. hexo编写发布博客
1 2 3 4 5 6 7 8 9 10 11 12 13 | //创建新的博客 hexo n title //本地的博客会保存在本目录下的source/_post文件夹中,会生成title.md文件,编辑并保存该文件 // 删除旧的 public 文件 hexo clean // 生成新的 public 文件 hexo generate 或者 hexo g // 开始部署 hexo deploye 或者 hexo d |
在浏览器中输入 https:/yourname.github.io (用户名改成你的),就可以看到你的git博客已经搭建成功了。
6.hexo常用指令整理
npm install hexo -g #安装Hexo
npm update hexo -g #升级
hexo init #初始化博客
命令简写
hexo n “我的博客” == hexo new “我的博客” #新建文章
hexo g == hexo generate #生成
hexo s == hexo server #启动服务预览
hexo d == hexo deploy #部署
hexo server #Hexo会监视文件变动并自动更新,无须重启服务器
hexo server -s #静态模式
hexo server -p 5000 #更改端口
hexo server -i 192.168.1.1 #自定义 IP
hexo clean #清除缓存,若是网页正常情况下可以忽略这条命令