Hexo+Github搭建个人博客(一)——开始搭建

title-picture

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

本文适用于Windows搭建

正文

什么是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上注册自己的账号,由于这些东西不是本篇博客要涉及到的主要内容,你可以谷歌、百度,也可以参考我下面提供的链接。

Git安装

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

Node.js安装配置

关于Node.js的安装以及配置,可以参照菜鸟教程上面关于Node.js安装配置的教程,上面也有下载的链接,本人就是参照上面安装的。具网上有些文章说,安装完成后最好重启电脑,以免之后无法使用hexo的相关命令,我倒是没有遇到,不过如果大家遇到这种问题就重启吧。

Hexo安装

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

1. 用以下命令安装Hexo

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

$ npm install -g hexo-cli

如果安装过程中遇到一下错误:

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

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 202,607评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,047评论 2 379
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 149,496评论 0 335
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,405评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,400评论 5 364
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,479评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,883评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,535评论 0 256
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,743评论 1 295
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,544评论 2 319
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,612评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,309评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,881评论 3 306
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,891评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,136评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,783评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,316评论 2 342

推荐阅读更多精彩内容