Hexo+Github搭建个人博客（一）

最新推荐文章于 2024-04-20 23:19:23 发布

xinyang_code

最新推荐文章于 2024-04-20 23:19:23 发布

阅读量162

点赞数

本文链接：https://blog.csdn.net/qq_36376387/article/details/80717950

版权

经常在查看技术文章时跳转到大佬们的个人博客，看起来很酷很炫。也想自己搭一个。嗯，于是有了这篇博客。

个人以为,学习使用一项技术之前首先要简单了解下它的基本概念,不要一上来就干~没前戏是不行的。所以我们不妨先来看一下Hexo 和 GitHub Pages分别都是什么，通过他们是怎么来搭建个人博客的。

Hexo官网上对它的定义是一个快速，简单而强大的博客框架。个人理解就是它可以把我们通过markdown编写的内容与主题模板结合，生成相应的Html静态页面。

Hexo 官方文档中有很详细的介绍，强烈建议同学们仔细阅读一下。

GitHub是代码托管平台，那GitHub Pages是什么呢？其实它就是GitHub提供的一个静态站点的托管服务，可以自定义一个页面，作为项目主页来显示。

Pages又分为两类：项目页面、个人/组织页面。功能上来讲是基本相同的，但还是有些细微的差别。项目页面顾名思义是与某个项目绑定的，其存储在该项目库中，而个人/组织页面不与特定项目绑定，并且网站文件位于专用于GitHub页面文件的专用存储库中，我们这里要使用的是个人页面。

GitHub Help Pages官方文档奉上~

Hexo和Pages二者，一个生成静态文件，一个展示静态文件，相结合，美滋滋~

接下来就可以开始搭建相关环境了。

使用到GitHub和Hexo,那Git自然是必不可少的，Hexo基于node.js，所以也需要安装node.js，安装好后再用node.js自带的npm工具来安装Hexo。

node.js直接官网从下载相应版本安装包安装，Windows安装时有个Add to PATH选项一定要勾选（默认是勾选的），这是添加到环境变量的意思。安装完成后在命令行输入node -v，如果版本信息可以显示，则说明安装成功。

完成上面两步后，就可以开始安装Hexo了！

首先在任意位置创建一个文件夹（命名随意，建议hexo或blog等英文名）用于存放hexo文件及博客资源等，然后在该文件夹下右键打开Git命令行（也可以是cmd，推荐git bash），输入以下命令即可完成安装！过程根据网络情况耗时不同，网络差的耐心等待就好。

npm install hexo-cli -g
hexo init
npm install

以上命令顺利执行后，我们就完成了hexo的安装。这时候可以执行hexo g和hexo s来生成预览你的博客啦。执行完后在浏览器中输入http://localhost:4000/来预览，嗯你会看到一篇Hello World！环境配置就结束了，接下来我们来创建GitHub仓库。

用于存储个人\组织页面Git仓库的命名是有要求的：

所以创建时一定要注意仓库的命名，比如我这样的：

仓库创建好之后需要把仓库地址配置到hexo配置文件_config.yml中（处于最外层目录），这里的仓库链接建议使用SSH的方式，如果没有配置过SSH Key可以参考配置Git ssh key。

hexo配置git

注意：_config.yml中的value和冒号之间都有一个空格

 npm install hexo-deployer-git  --save

直接命令行安装就可以。比较简单，但对网络要求比较高，网络差的这一步会很慢。

安装好上面插件后，就可以部署到GitHub了。输入下面命令(表示先编辑再发布)，过程可能稍慢。

hexo d -g

在发布完成后就可以打开username.github.io来试试看能不能访问了。

关注