您的位置: 首页  >  IT文章  >  使用hexo搭建github博客

使用hexo搭建github博客

分类: IT文章 • 2022-04-08 10:48:46

导言

这两天看了些技术文章，心血来潮突然想搭建一个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错误的解决方法
知乎专栏

相关推荐