Hexo + GitHub Pages搭建个人技术博客

环境准备

• 使用Hexo，需要在电脑中安装Nodejs和Git。

• Node.js下载地址 点我

  安装界面如下，一路Next即可。

  

• Git安装可以去百度，很多。

• 最后检查是否安装成功，如下图

  

安装Hexo

• 提示：进行下面的步骤时，由于国内的网络问题，有时候可能会很慢。有时候也会出现一些莫名其妙的坑。所以这个时候你可能需要npm换源 这个 感谢此文作者，感谢淘宝~~ 。你也可以先进行下面的步骤，出现问题再来看这个

• 下面的步骤强烈建议在 Git Bash中进行，如果用CMD命令行会有很多意想不到的坑。

1. 可以在任意盘符下建立文件夹 如 F：/hexo

2. 进入该目录下，右键打开Git Bash

3. 执行命令 npm install hexo-cli -g 安装hexo

4. 执行命令 hexo init 进行初始化操作

5. 执行命令 npm install

6. 执行命令 hexo g 生成静态文件，此命令会在当前目录下生成一个public文件夹。此文件夹的内容后面会上传到github来作为我们博客的内容。

7. 执行命令 hexo s 用来启动服务。这时候去浏览器输入 http://localhost:4000 就可以看到本地页面啦~。如下图

   

更换主题

1. 你可能不太稀饭这个主题风格，可以下载其他风格~。你可以执行下面的命令下载另一个主题。

   $ hexo clean
   $ git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia
   
   

2. 要想使用此主题，还需要设置一下。修改Hexo目录下的 _config.yml 配置文件中的theme属性，将其设置为yilia。

   $ cd themes/yilia
   $ git pull
   $ hexo g # 生成页面
   $ hexo s # 启动本地服务
   
   

   现在打开 http://localhost:4000/ ，会看到我们已经应用了一个新的主题。

   

什么是Github Pages

1. 每个Github都可以有一个仓库来放置个人主页，仓库的名称必须是youname/youname.github.io。这是一个特殊的命名约定。创建好仓库你可以通过http://username.github.io来访问你的个人主页。需要注意的是，你的内容需要放在master分支下面。

2. 注册GitHub及使用Github Pages的过程百度有很多，不再赘述。

上传内容到Github Pages

• 提示：上传之前需要安装一个扩展 npm install hexo-deployer-git --save

1. 如果要把自己生成的网页内容上传到Github Pages，需要到前面我们生成的hexo文件夹下，找到配置文件 _config.xml 。做如下的修改

   deploy:
   type: git
   repo: git@github.com:xxxxx/xxxx.github.io.git
   branch: master
   

2. 然后执行 hexo d 即为将内容部署到github上。期间你可以选择通过SSH的方式，也可以通过HTTPS的方式。区别就是输不输账号密码了，个人喜欢通过https的方式上传。（通过SSH KEY的方式需要去git bash和github配置，不会就百度吧，很多文章~）

3. 部署成功后，可能会存在延迟，访问 https://xxxxx.github.io/ 就可以看到内容啦。

你还需要的东西

• 通过上面的步骤，我们成功的将本地的静态页面上传到github并且能成功的访问了。兴奋ing~~ 但是我们只是学会了如何上传，而且只有一个hello文章。一个博客最重要的当然还是内容了。下面介绍如何给博客添加内容。

1. 以下是上面用过的一些命令的解释

   1. hexo generate (hexo g) 生成静态文件，会在当前目录下生成一个新的叫做public的文件夹
   2. hexo server (hexo s) 启动本地web服务，用于博客的预览
   3. hexo deploy (hexo d) 部署播客到远端（比如github, heroku等平台）

2. 下面是新建文章的相关命令

   $ hexo new "postName" #新建文章
   $ hexo new page "pageName" #新建页面
   
   $ hexo n == hexo new
   $ hexo g == hexo generate
   $ hexo s == hexo server
   $ hexo d == hexo deploy
   
   $ hexo d -g #生成部署
   $ hexo s -g #生成预览
   
   

3. 新建的文章你可以在source文件夹下找到，然后~ 开始写作吧markdown语法可以参照 http://wowubuntu.com/markdown/

4. 预览文章时，觉得长度过长。可以在你需要截断的地方加上 ****

5. 最后，最好的文档还是官方的⊙０⊙ https://hexo.io/zh-cn/docs/

• QQ 527369301