使用hexo+github搭建个人博客网站

最新推荐文章于 2024-06-25 12:52:44 发布

原创最新推荐文章于 2024-06-25 12:52:44 发布 · 728 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#hexo #github #个人博客

框架工具类专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一种快速简便地使用Hexo和GitHub搭建个人博客的方法。通过安装必要的软件如Git、Node.js，并设置GitHub仓库，结合Hexo进行本地开发及部署，实现了免费且简洁的博客网站。

一直想搭建一个个人博客网站的，懒癌晚期拖到毕业了才开始做这件事。个人想法是先写好网页再发布，搜索了相关资料发现有以下途径：

使用wordpress建站，搭建好后需要发布到云服务器上，有点麻烦。
使用hexo配合github建立博客网站，简洁且不掏钱。

目前只知道这个方法，本人是想着越快越简洁就行，而且博客网站就是个记录学习过程的网站，后台啥的也不需要，hexo就可以做到了。
搭建环境：windows8
用到的工具：git、node、hexo、github账号等。

1、安装git

网上教程一大把，就不多说了，安装配置好后使用

git --version

就可以看到配置好的git版本了，我用的是1.9.5
这里写图片描述

2、安装node

这里附上node的安装包下载，下载好之后安装即可，环境自己会配置好，使用node和npm指令查看是否安装成功。
这里写图片描述

3、注册github并创建仓库

去github官网注册一个github账号，github应该不会被墙吧，我用的移动宽带都可以访问，打不开只能想法子翻墙了。
注册好账号之后,新建一个仓库Repository，命名为”你的用户名.github.io“，如下图所示：
这里写图片描述
注意命名，这里由于我已经创建了，所以显示为红色

创建好仓库之后，点击README.md，创建一个文档，这即将是你主页的界面了。
这时候如果你直接打开name.github.io是报404的，去看了下github的帮助文档，上面说需要创建一个docs的文件夹，就先点击右上方”Create new file“创建个文件夹，在框中输入"doc/"即可创建一个文件夹，再随便写个文件名就创建成功了。去settings中查看到下面即为创建成功了，
这里写图片描述
之后使用访问yourname.github.io即可看见你的仓库中的README.md了（这个过程有点延迟，可能要等个几十秒）。

4、安装配置hexo

使用npm安装hexo

npm install -g hexo-cli

npm install hexo --save

命令行输入上述命令之后输入hexo -v检查是否安装成功
这里写图片描述

5、本地新建hexo项目

将命令行目录切换到你要保存博客项目的路径下，使用下面命令即可新建一个名为test的工程

hexo init test

再使用”cd test“切换到test目录下，使用

npm install

安装项目所需要的依赖包文件，最后项目文件目录如下所示：
这里写图片描述

node_modules存放依赖包
themes存放主题包
_config.yml存放项目的配置文件
source存放博客文章

工程初始化完成后使用命令启动项目

hexo s -g

这里写图片描述
再使用浏览器打开localhost:4000即可看到新鲜出炉的博客网站了

还是可以的吧，觉得不满意的后期还可以自己去找主题更换。

6、将hexo项目推送到github上

打开项目的配置文件_config.yml，修改以下配置

# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site
title: 曹俊胜博客
subtitle: 编程小菜鸡
description: 博客记录
author: Junsheng Cao
language: zh-CN
timezone:

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://Caojunsheng.github.io
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: https://github.com/Caojunsheng/Caojunsheng.github.io.git
  branch: master

就把以上两个部分的文件修改下自己对应的github配置就好了，最后使用下面命令：
发布博客

设置git身份信息

git config --global user.name "你的用户名"
git config --global user.email "你的邮箱"

安装hexo git插件

npm install hexo-deployer-git --save

每次部署的步骤，可按以下三步来进行。

hexo clean

hexo generate

hexo deploy

发布更新博客

hexo d -g

最后就可以在Caojunsheng.github.com上查看到部署的 hexo博客了。