初次使用hexo搭建博客,因为对github也不是很熟,网上找了不少资料,花了一个星期才把整个流程,包括后续更新修改搞明白,记录下来,方便查阅,后续有新的经验再更新。
Git
下载并安装Git,设置用户名邮件地址。
已初始化过的忽略此处
Github
要使用GitHub Pages + Hexo搭建免费的博客,需要在自己的Github账号下创建一个新的仓库,且命名为 username.github.io(username是你的账号名)。
注:网上很多文章里面,直接写在GitHub账号下创建一个新的仓库即可,最终就可以通过 http(s)://username.github.io 方式访问,这种方法是不正确的,详细区别请了解GitHub Pages的两种类型,User/Organization Pages 和 Project Pages。
Hexo
- 保证电脑中已经安装Node.js和Git
- 开始Hexo安装,找到安装的Git,点击Git Bash,输入
$ npm install -g hexo-cli
。此时,安装完后可以在对应目录下找到安装的程序 - 在想放置该博客目标的文件夹下,右击选择 Git Bash here,输入
$ hexo init
,此处也可以在任意地方键入$ hexo init <folder>
,此处指放置代码的位置,不输入默认为当前文件夹下。 - 接着,键入
$ npm install
,此处是安装依赖包。 - 此时,键入
$ hexo server
,即可在浏览器中通过http://localhost:4000/看到初始化效果了。
至此,就搭建好了最基础的本地的Hexo网站了。
Github+Hexo
最终目标是要通过Hexo搭建一个别人可以看到的网站,所以需要和之前的Github一起,修改安装其他内容。
找到刚刚文件夹下面的 _config.yml 文件,该文件是网站的基本配置,包括标题,副标题,作者,语言等信息,可以根据自己需求修改。此处重点是要修改deploy处,找到deploy:,修改为下面这样:
deploy:
type: git
repository: git@github.com:username/username.github.io.git
branch: master
因为需要把Hexo部署到GitHub上,需要安装一个插件:
$ npm install hexo-deployer-git --save
安装完成后,可以执行 $ hexo generate ,此时会生成一个public文件夹,里面是编译后的网站页面。
再输入$ hexo deploy
,即可完成在Github上部署。
此时,通过浏览器键入:username.github.io就可以看到效果了。
注:
- 在配置deploy时注意,冒号:后面都有空格;
- 再向Github提交过程中,可能出现没有SSH key的情况,重新按步骤设置SSH key 即可;
- 此时,在Github中看到是public文件下的内容,如果想在Github上部署前的源代码,即hexo其他内容,需要通过git add,commit等步骤提交。
hexo日常使用
参考网上多数教程里面优化部署,在hexo使用过程中,我是在github里面建立了两个分支,master和blog,master主要安置的内容是public,即网站及时更新后的内容,blog里面是源码,比较方便。
在日常修改或者添加文章等操作后,在blog分支下,进行hexo generate,hexo deploy操作以更新master里面的内容,再刷新username.github.io即可看到修改效果,再通过git status查找文件变化,git add,git commit以及git push origin blog后同时也保证了再github中记录了文件变化更新。
如果更换电脑后,需要git clone 源代码到本地后再进行其他操作。
详细的日常使用,请参考另一篇文章《Hexo日常使用》。