通过Hexo+Github Pages搭建个人博客

发表于 | |

第一次写Blog,多多包涵！

大概步骤：

  1. 搭建环境（安装NodeJS,安装Git,安装Hexo,配置Hexo）
  2. 配置Github
  3. 发表文章

搭建环境

  1. 安装NodeJS

    windows下的NodeJS安装是比较方便的,到NodeJS官网下载安装
    安装完成后可以在cmd中输入node -v查看是否安装成功，由于NodeJS已经集成了npm,所以可以通过npm -v查看安装版本信息

  2. 安装Git

    因为需要发布到Github，所以需要安装Git
    Git的官方下载地址
    可以通过git –version查看版本信息

  3. 安装Hexo

    新建一个目录用于安装Hexo,如D:\lsjkobe\blog
    进入到这个目录下,这里说一个技巧,在当前目录下按住shift,然后点击鼠标右键,选择在此处打开命令窗口,可以在当前目录下快速进入到cmd
    在命令行中输入:

    1
    npm install hexo-cli -g


完成之后如图所示,然后在命令行中输入:

1
npm install hexo --save


安装完之后如图所示,在命令行输入以下命令查看hexo安装信息:

1
hexo -v

  1. 配置Hexo

    接着上面的操作，在命令行中依次输入:
    1
    2
    hexo init
    npm install

npm install会下载相关的依赖,这时候环境基本已经搭建完成
可以本地体验一下了
体验前先来熟悉一下hexo常见的命令

1
2
3
4
5
hexo s :启动本地服务器
hexo g :生成网站静态文件到默认设置的 public 文件夹
hexo d :自动生成网站静态文件，并部署到设定的仓库
hexo new "xx" :新建一篇标题为xx的文章
hexo clean :清除缓存文件 db.json 和已生成的静态文件 public

首先先在命令行中输入:

1
hexo g

生成网站静态文件
然后在命令行中输入:

1
hexo s

这样就代表启动服务器成功,默认地址：http://localhost:4000/

在浏览器输入http://localhost:4000/

配置Github

  1. 创建一个[youname].github.io的仓库

    登录github后，点击页面右上角的[+]按钮
    然后点击[New repository]新建一个仓库

    进到仓库页面后按照图片的格式创建

    创建成功会看到这样界面

    这时候点击README或其它的随便创建一个文件,创建完成后点击Settings去设置github pages

    如图红色框中选择master branch和点击save保存
    这时候点击Code去拿到仓库地址

    然后去到本地博客的根目录下站点配置文件_config.yml中配置,比如我的仓库地址是https://github.com/lsjkobe/lsjkobe.github.io.git,那么配置如下
    1
    2
    3
    4
    deploy:
      type: git
      repo: https://github.com/lsjkobe/lsjkobe.github.io.git
      branch: master

这样hexo和github pages就关联起来了,这时候就可以通过在命令行中输入:
提醒：跑下面命令前需要先安装一个插件,通过命令：npm install hexo-deployer-git –save

1
2
hexo g
hexo d

这样就把博客部署到github pages上了,这时候可以通过https://yourName.github.io 访问到你的hexo博客了

发表文章

在命令行中输入:

1
hexo new "Hello World"

会在根目录\source_posts下新建一个叫Hello World的markdown格式的文件,这个就是新建的文章,可以通过markdown编辑器编辑你的内容,编辑完成后
可以重新在命令行中输入:

1
2
hexo g
hexo d

这时候再打开https://yourName.github.io 就会能看到新发布的文章了