使用hexo搭建github博客
导言
这两天看了些技术文章,心血来潮突然想搭建一个github博客。在网上搜了一些教程,花了点时间,终于把博客搭好,下面简单记录下搭建过程,做个记录。
原理
在网上看了几个教程,很多上来就是按照步骤输入命令行安装,运行。一开始看到云里雾里,虽然最终是安装成功了,但相信对于不少新手读者来说存在不少困惑。
下面是自己的一点粗浅理解。首先,我们知道,NodeJS是一个宿主运行环境,我们可以在上面运行使用javascript写的程序。npm是一个包管理工具。在编写javascript代码的过程中,我们可以通过npm来安装、卸载、更新项目所依赖的包。而hexo就是这么一个包,它可以通过npm来安装,而与一般的包只能被导入所不同的是,hexo还能作为普通的命令来使用,当它被调用的时候,实际上它是调用了NodeJS作为运行环境来运行程序。
所以实际上我们只要将hexo作为一个普通的命令来使用就行。
那hexo和github又是什么关系呢?
实际上如果你实际使用会发现,使用hexo命令创建的博客文件夹中有一个public文件夹,里面放的跟你在github上的仓库内的文件是一毛一样的。也就是说,其实hexo的作用就是将你本地创建的Markdown文件连同模板一起转化成为静态的html文件,然后放到github仓库上面。
当我们访问我们所创建的静态网页的时候,我们可以发现,所有页面的url都是github仓库的文件路径。那么从原理上来说,你甚至完全不用管什么hexo,只要在github上创建一个 username.github.io 的仓库然后想里面放html网页文件就可以了。当然要渲染出漂亮的页面还是用工具方便些。
安装和使用
安装NodeJS
既然hexo依赖于NodeJS那么先安装NodeJS,可以参考一下官网,windows下是一路next,*unix下也就一句命令的事,此处不赘述。一般来说npm都是随NodeJS一同安装的。安装完记得检查一下,在命令行输入下列命令:
$ node -v
$ npm -v
安装hexo
前面已经说了,hexo其实是一个包,所以只要使用npm管理工具安装即可:
$ npm install -g hexo-cli
然后就可以在任何地方使用hexo这个命令来创建博客程序了。
安装git
使用git相信是绝大部分使用程序员的必备技能,此处不多说,window下下载个安装包一路next,*unix下也是一行命令的事。
配置git
为了能够将代码顺利上传到远程仓库,安装完还是要配置一下git,这里使用ssh-key的方式验证身份。
生成密钥
$ git config --global user.name "gitHubusername"
$ git config --global user.email "gitHub_email"
$ ssh-keygen -t rsa -C "github_email"
这里说一下,上面命令前两句是说设置用户名和邮箱为你自己的用户名和邮箱,ssh-keygen是使用你的github邮箱生成本机上的公钥。非对称加密方式要求远程服务器知道你的公钥来验证你的身份。同样,你也需要知道远程服务器的公钥,来验证对方的身份。如无意外你将在自己的用户文件夹下生成一个叫.ssh的文件夹,里面有一个id_rsa.pub的文件,这里面就是你的公钥。
上传公钥
在你自己的github账户右上方头像中点选Settings点选SSH and GPG keys,然后在右上方点选New SSH key, 然后将id_rsa.pub中的内容全部粘贴上去并保存。这样公钥就上传完成了。
$ ssh git@github.com
上面的命令可以验证前面的公钥是否成功配置。
至此基础设施已经完全配备完成。下面就可以使用hexo来创建博客了。
使用hexo
我们可以创建一个我博客文件
$ hexo init foldername # flodername是可选的,不填就在当前文件夹直接生成许多文件
$ cd foldername # 不填foldername就不用进入了
$ npm install # 根据package.json安装依赖包
至此一个博客文件夹就做好了,然后就可以开始创建你的文章了:
$ hexo new your_article_title
然后你就有了一个md文件,通过这个途径创建的文章都放在source/_posts中,当然在创建项目之初就为你创建了一篇著名的hello,world让你过目了。
然后你就可以用你想要的任何编辑器来编辑里面的文件。
如前所述,hexo是一个工具,它将Markdown文件连同模板一起渲染成静态html文件。现在既然你已经编辑好了你的文章,可以通过以下命令来进行转化:
hexo generate
敲下命令你会发现多了一个public文件夹,里面就是你的html文件。
现在要将html文件传到远程仓库,hexo命令怎么知道你的仓库是多少呢?这时就要在_config.yml文件中配置了,打开文件拉到最底下,配置成下面的样子:
deploy:
type: git
repository: git@github.com:username/username.github.io.git
branch: master
这里需要注意的是username是你git上的用户名,而repository的值是git上的仓库username.github.io的ssh地址。如果你写https的形式有可能会出错(反正我试过是出错的)。
这样还不够,hexo本身没有提供调用git的功能,所以要安装一个依赖包:
$ npm install hexo-deployer-git --save
如无意外,你就可以将文章放到git仓库上。下面是意外,安装上面依赖的时候你可能会遇到:
platform unsupported hexo-deployer-git..............
这样的错误。这时可以尝试以下命令:
$ npm rebuild node-sass
然后再安装一次:
$ npm install hexo-deployer-git --save
最后是将文件部署到github上:
$ hexo deploy
你也可以先在本地预览一下效果,部署到本地端口(默认4000):
$ hexo server
结语
至此hexo部署和使用过程就描述完了,总结一下,hexo的作用是将Markdown文件连同模板渲染成静态文件,它的运行依赖于NodJS运行环境,它的安装可以使用npm包管理工具,每个博客的配置文件是_config.yml。当然这些介绍还是过于简陋,更加详尽的功能还需要在今后使用中进一步探索。
参考
官方文档
could not read Username for 'https://github.com': Invalid argument错误
安装hexo-deployer-git错误的解决方法
知乎专栏