我是如何使用hexo搭建这个blog的

发表于   |  

简介部分

工具简介

  • Git是一款基于命令行的版本控制软件。
  • GitHub是Linus Torvalds为了在Linux操作系统上帮助程序员控制软件版本的一个开源网站。我们需要GitHub来托管我们的代码、资源等静态资源。
  • GitHub Pages是GitHub提供的300MB免费Websites空间。
  • Node.js是一个基于谷歌V8引擎的JavaScript运行环境(runtime),用于方便地搭建速度快、易扩展的网络应用。
  • hexo是一款基于Node.js的静态博客框架。

    搭建环境

    1.到Git下载安装，一路下一步，直到完成。
    2.安装Node.js,一路下一步，直到完成。安装完成之后，需要配置环境: 我的电脑–属性–高级系统设置–环境变量–Path下添加 ;C:\Program Files\nodejs\
    3.安装hexo:右键桌面，点击Git Base Here并执行一下指令:
    1
    $ npm install-g hexo

4.初始化hexo:在本地硬盘新建一个文件夹(名字自己取),右键点击空白处，点击 Git Base Here

1
$ hexo init

5.生成静态页面

1
$ hexo generate (或者 hexo g)

6.启动本地服务，进行测试

1
$ hexo server

7.在浏览器输入http://localhost:4000
如果能打开网页就证明上述过程全部成功了。

创建自己的WebSite

使用GitHub Pages创建自己的WebSite

  • 在自己的GitHub主页右上角点击+ ,然后点击New respository
  • Repository name填写: [username].github.io(我的name是minokoko,所以我的repository name为minokoko.github.io)
  • 到本地硬盘，刚才搭建环境第4步新建的文件夹里面(比如我建的文件夹是blog),打开_config.yml,在文件底端添加以下代码:
    deploy:
    type: git
    repo: https://github.com/minokoko/minokoko.github.io.git (将minokoko换成自己的用户名)
    branch: master
  • 右键点击 Git Base Here,输入以下指令:
    1
    $ hexo generate

这样就创建一个一个public文件夹，里面包含了网页所有的静态资源。
每次部署到Github前都建议使用这个命令来保证修改的内容已经重新生成。

  • 然后执行以下指令:
    1
    $ hexo deploy(也可以 hexo d)

部署到GitHub中.

  • 在浏览器中输入:http://minokoko.github.io (minokoko换成自己的用户名)
    如果能打开网页就证明上述过程全部成功了。

修改主题

  • 完成以上过程，登录自己的网站会发现是hexo默认的模版主题，那么如何修改为自己想要的漂亮的主题呢?

    下载主题

  • 到GitHub搜索hexo,便会出现很多带有thems标签的项目,fork一个自己喜欢。
    比如我想下载的主题的是next
    然后在本地硬盘的blog/thems下(blog是我自己建的文件夹)，右键点击Git Base Here，输入以下指令:

    1
    $ git clone https://github.com/iissnan/hexo-theme-next.git

  • 接下来到根目录下，打开_config.yml，做如下修改:
    theme: next
    返回根目录,执行以下命令:

    1
    $ hexo s --debug

好了，网站的主题就修改漂亮了。