Hexo+Github搭建我的博客(一)——开始搭建

title-picture
  前段时间本人利用业余时间,在网上查询各类资料,使用Hexo+Github的方式搭建起了我我的的博客—— BrightLoong。相信网上已经有无数前辈写了相似的文章来记录如何搭建博客的过程和步骤,我也不哗众取宠或者班门弄斧了,把我在搭建博客中使用 资料作一个收集,同时也将我在搭建博客过程当中遇到的坑列举出来,以及对应的解决方法,也是对搭建博客过程的一个记录,毕竟好记性不如烂笔头。那话很少说,接下来就是一个简单的介绍以及如何搭建的步骤(本文基本也是安照官方的步骤在介绍,我只是在有些地方记了下本身踩过的坑,强烈建议你们跟着 Hexo官方文档操做)。

本文适用于Windows搭建html

正文

什么是Hexo

在Hexo官网上如此描述:Hexo is a fast, simple and powerful blog framework. You write posts in Markdown (or other languages) and Hexo generates static files with a beautiful theme in seconds.(Hexo是一个快速,简单和强大的博客框架。你可使用Markdown(或其余语言)写博客,以后Hexo能在几秒钟生成具备美观主题的静态文件。)若是你想了解更多关于Hexo的东西,请移步Hexo官网
  Hexo是一款基于Node.js的静态博客框架,能够deploy到Github上,因此首先要在电脑上安装git和node.js,并在Github上注册本身的帐号,因为这些东西不是本篇博客要涉及到的主要内容,你能够谷歌、百度,也能够参考我下面提供的连接。node

Git安装

你能够去官网下载Git,由于国外资源可能很慢,你也能够下载我在网盘上提供的Git镜像。具体如何使用,请参照廖雪峰老师关于Git的教程,若是你仅仅是想安装git那看看Git安装的那个章节git

Node.js安装配置

关于Node.js的安装以及配置,能够参照菜鸟教程上面关于Node.js安装配置的教程,上面也有下载的连接,本人就是参照上面安装的。具网上有些文章说,安装完成后最好重启电脑,以避免以后没法使用hexo的相关命令,我却是没有遇到,不过若是你们遇到这种问题就重启吧。github

Hexo安装

必需要在你安装了上述的Git以及Node.js以后才能进行Hexo的安装。shell

1. 用如下命令安装Hexo

在任意地方点击右键,选择Git Bash Herenpm

$ npm install -g hexo-cli
复制代码

若是安装过程当中遇到一下错误:json

ERROR Deployer not found : github
复制代码

运行浏览器

$ npm install hexo-deployer-git --save
复制代码

2. 建立博客存放目录,并进行初始化,安装依赖包(最好不要使用带中文的路径,以避免后面出现没必要要的麻烦)

打开一个目录,在这个地方点击右键选择Git Bash Here,执行如下命令服务器

$ hexo init <folder> #建立目录并执行初始化
$ cd <folder>
$ npm install #安装依赖包
复制代码

<folder>改成你想要的目录。   固然你也能够本身新建一个目录,好比我在F盘中建立了myblog目录,进入目录中点击右键选择Git Bash Here,直接执行如下命令网络

$ hexo init 
$ npm install
复制代码

无论你用哪一种方式,执行完毕后你会发现如下目录结构

.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes
复制代码

3. 启动服务

执行如下命令来启动服务

$hexo g #hexo generate,生成静态文件
$ hexo s #hexo server,启动本地服务器
复制代码

若是启动过程当中没有报错,此时你用浏览器访问http://localhost:4000/,是否是看到了一个Hello World的博客页面,hexo3.0使用的默认主题是landscape(以后我会讲如何更换主题,以及集成第三方的工具),并且此时的服务是本地启动的,别人并不能看到(继续我接下来的操做就行了)。
  这个时候若是在浏览器没看到漂亮的博客页面怎么办,别急,先确认你在启动过程当中是否是报错了,如过有的话估计是上面的操做有误,若是没有而且发现页面一直在加载中,估计是端口被占用了,我就遇到了这个问题。怎么办?把4000端口给杀死,还有更简单的——在hexo s命令后面加上启动参数,修改默认端口:hexo s -p <port>,好比我用的 hexo s -p 8000,如今从新访问http://localhost:8000/记得把地址的8000改为你本身对应的端口号,是否是看到了美丽的界面。

4. 注册Github帐号,并建立仓库。

想要别人也访问到你的页面,跟着继续吧。首先在Github官网上注册一个帐号,有帐号的跳过注册,直接登陆。登陆后找到new repository按钮建立一个新的仓库。

new repository

而后填写repository name就好了,要注意的是:这个名字的格式必须为youname.github.io,而且必须和你的帐户名相同,好比个人帐户名是BrightLoong,个人地址就是brightloong.github.io(最开始我就是将name随意填写,虽然是这个格式可是根本访问不了,会报404的错误)。

creat repository

5. 将本地文件推送到github

最后,剩下的就是将本地文件推送到github上了,首先打开站点配置文件_config.yml,好比个人路径是:F:\myblog_bonfig.yml。找到最后的deploy属性,若是没有就本身添加,将配置修改成:

deploy:
  type: git #推送方式
  repository: https://github.com/BrightLoong/BrightLoong.github.io.git #你的推送地址
  branch: master #你要推送的分支
复制代码

这个地方要注意的是属性后面的冒号必需要有一个空格,不然会报错

配置好以后使用如下命令将服务部署到github上。

$ hexo clean
$ hexo g
$ hexo d
复制代码

使用hexo d命令,第一次会要求你输入用户名和密码,用户名和密码就是你注册github时候使用的用户名和密码。若是遇到如下错误:

ERROR Deployer not found : github
复制代码

运行

$ npm install hexo-deployer-git --save
复制代码

再执行上面的命令。

$ npm install hexo-deployer-git --save
复制代码

若是你没有配置Github的SSH,那么可能须要配置一下,你能够用如下命令查看一下

ssh -T git@github.com
复制代码

若是成功会有如下提示(个人帐户名叫BrightLoong)

Hi BrightLoong! You've successfully authenticated, but GitHub does not provide shell access.
复制代码

若是没有,能够参考博客git添加ssh-key查看config

若是没有报错误,那么博客就已经搭建起来,并发布到Github上了,在浏览器输入youname.github.io就能看到本身的博客了,若是中途报错说未识别的用户名,那么若是你肯定你填写是正确的,重复使用hexo d命令,我当时就遇到过这种状况,我估计是网络很差引发的。

结尾

博客已经搭建起来了,是否是正如Hexo所说——fast, simple and powerful,这篇文章就说这么多。以后我介绍如何发布文章,更换主题,站点配置文件,以及如何集成第三方应用(多说评论、百度分享等)。但愿对你们有帮助。

版权声明:本文为博主原创文章,转载请注明出处 BrightLoong’s Blog

相关文章
相关标签/搜索