GitHub Pages + Hexo 个人网页搭建过程

2019-12-25 本文已影响0人 KyneMaster

首先不用购买服务器，小白可以搭建，只需要按照步骤配置，炒鸡简单。

换个角度讲：

我们通过github pages 搭建我们的主页服务，然后通过hexo挑一个博客框架嵌套进去。这样就完成了我们的个人主页。

image

整个过程分三部分：

启动GitHub pages的个人主页服务；

配置Hexo；

github pages 和 Hexo 合二为一

注册GitHub账号
- 地址：https://github.com/
- 看好自己的useranme
开启GitHub pages服务
- 新建仓库（create a new repository）
  仓库名字要注意：username.github.io
  image
- 在仓库下的setting中找到GitHub Pages部分 Choose a theme 选择一个主题样式
  image
  image
- 保存之后即完成打开: https://KyneMaster.github.io （username.github.io）

安装hexo

npm install hexo-cli -g
hexo init blog(生成的博客文件夹的名字，自定义,会自动在对应执行该语句的路径生成对应的文件)
cd blog
npm install

新建完成后，指定文件夹的目录如下：

.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

安装成功测试终端输入hexo -v 输出版本及安装成功

运行hexo
```
hexo g (编译)
hexo s（启动服务）
```
然后会提示你打开 http://localhost:4000 如下：

image
到这里基本hexo已经配置完毕
配置主题

那么接下来就是更换主题。地址：https://hexo.io/themes/

点击喜欢的主题名，跳转到GitHub代码，下载或者克隆代码。完成之后，找到刚才hexo安装完成文件目录中的themes文件夹，将主题文件粘贴到此处。

此处注意两个配置文件，一个是hexo安装完成的目录中的_config.yml和下载主题中的_config.yml.

在hexo的_config.yml找到themes，将后面代码改成下载主题的名称。

然后编译启动，可以本地localhost:4000查看此主题。

到此完成该部分。

那么最后一步就是将GitHub的线上主页同我们下载配置的hexo博客主题合二为一。

找到hexo中的配置文件_config.yml ——> 打开 ——> 找到Deployment部分

deploy:
    type: git
    repository: https://github.com/KyneMaster/KyneMaster.github.io.git (此链接改为自己的)
    branch: master

然后执行：

hexo clean （清除掉编译出来的public文件）
hexo g     （编译）
hexo d     （部署到GitHub）

稍等片刻，打开线上username.github.io，即可见证奇迹。

写文章

文章地址：

image
也可以通过cmd命令创建hexo new demo.md
上传同样进行三步走

hexo clean （清除掉编译出来的public文件）
hexo g     （编译）
hexo d     （部署到GitHub）