利用Hexo搭建个人github博客

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/hujingshuang/article/details/79123192

安装Hexo

关于 Hexo

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。

安装前提

安装 Hexo 相当简单。然而在安装前，您必须检查电脑中是否已安装下列应用程序：

• Node.js
• Git

安装 Hexo

如果您的电脑中已经安装上述必备程序，那么恭喜您！接下来只需要使用npm即可完成 Hexo 的安装。在任意位置打开Git Bash，输入命令：

• $ npm install -g hexo-cli
  注意：前面有$的表示都在Git Bash中执行的命令，后文不在重复说明。

建站

安装 Hexo 完成后，请执行下列命令，Hexo 将会在指定文件夹中新建所需要的文件。

• $ hexo init <folder>
• $ cd <folder>
• $ npm install

比如：建立了一个文件夹，路径为D:\Blog，则在D:->右键->Git Bash在输入命令：

• $ hexo init Blog
• $ cd Blog
• $ npm install

至此，已经 Hexo 已经建立好了。

默认主题

在 Hexo 中提供了一个默认的landscape主题，可以在浏览器中打开： http://localhost:4000/。不过在打开之前需要先运行命令，生成静态页面至public/目录；最后，开启预览访问端口（默认端口是 4000）：

• $ hexo generate
• $ hexo server

当出现一下信息，表明服务开启，你可以通过 http://localhost:4000/ 在浏览器中打开。

INFO Start processing
INFO Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.

总结一下

• npm install hexo-cli -g
• hexo init <blog>
• cd <blog>
• npm install
• hexo server

坑

1. 打不开http://localhost:4000/？

   • 查找原因：Hexo 默认的端口4000，在cmd输入netstat -ano | findstr "4000"，找到 4000 端口在最后一列中所对应的 PID 值，然后在 任务管理器 -> 详细信息 中通过 PID 发现对应的应用程序，结果是 FoxitProtect.exe (福昕阅读器) 这货，占我端口，耗我青春！

   • 两种解决办法：

     • 换一个端口（如5000）：

       执行命令：$ hexo s -p 5000

     • 释放4000端口：

       先结束占用端口的进程，再执行命令： $ hexo s

切换主题

发现主题

到Hexo的官网去浏览，选自己喜欢的主题风格。例如，我的博客主题风格为：hexo-theme-prontera,然后在D:\Blog中右键->Git Bush中输入：

• $ git clone https://github.com/AngryPowman/hexo-theme-prontera.git themes/prontera

或者：

• $ git clone [email protected]:AngryPowman/hexo-theme-prontera.git themes/prontera

你可以看到themes/目录中多了一个prontera文件夹。

切换主题

在D:\Blog\中找打_config.yml并打开，修改配置文件。将：

theme: landscape

修改为：

theme: prontera

当然，根据该主题风格的安装介绍，需要两个依赖，故执行：

• $ npm install hexo-renderer-jade --save
• $ npm install hexo-generator-feed --save

最后，执行命令：

• $ hexo generate
• $ hexo s -p 5000

坑

1. 执行$ hexo g报一堆错？
   
   • 解决方法：在_config.yml配置文件中，特别需要注意的是，任何:后需加一个空格！

部署到GitHub

新建 repository

登录到个人github上，新建一个repository，名字必须是user_name.github.io，其中user_name跟github的名字一致。
例如，我的github地址为 https://github.com/hujingshuang，则repository名就为hujingshuang.github.io。

修改配置

有了之前对配置文件_config.yml的修改操作经验，现在要将主题发布到刚才新建的hujingshuang.github.io仓库中。
对_config.yml作如下修改：

deploy:
　type: git
　repository: [email protected]:hujingshuang/hujingshuang.github.io.git
　branch: master

上面用的是SSH，当然你也可以使用HTTPS方式：

deploy:
　type: git
　repository: https://github.com/hujingshuang/hujingshuang.github.io.git
　branch: master

部署

部署到github上，使用命令：

• $ hexo d

最后，访问你的个人博客主页，比如我的是：https://hujingshuang.github.io/

坑

1. 在部署时出现错误信息：ERROR Deployer not found: git？
   

   • 解决方法：
     

   输入命令：$ npm install hexo-deployer-git --save
   重新部署：$ hexo d

2. 部署到github上的博客打不开，出现404？
   

   • 解决方法：
     

   清除缓存：$ hexo clean
   重新部署：$ hexo d

---

附录

常用插件

• $ npm install hexo-generator-index --save # 索引生成器
• $ npm install hexo-generator-archive --save # 归档生成器
• $ npm install hexo-generator-category --save # 分类生成器
• $ npm install hexo-generator-tag --save # 标签生成器
• $ npm install hexo-server --save # 本地服务
• $ npm install hexo-deployer-git --save # Hexo 通过 git 发布
• $ npm install [email protected] --save # 渲染器
• $ npm install [email protected] --save # 渲染器

常用命令

简写

• hexo n "我的博客" == hexo new "我的博客" # 新建文章
• hexo p == hexo publish
• 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 # 清除缓存 网页正常情况下可以忽略此条命令

• hexo g # 生成静态网页
• hexo d # 开始部署

监视文件变动

• hexo generate # 使用 Hexo 生成静态文件快速而且简单
• hexo generate --watch # 监视文件变动

完成后部署

这两个命令的作用是相同的

• hexo generate --deploy
• hexo deploy --generate

同上：

• hexo server -g
• hexo deploy -g