前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Hexo+Gitee pages搭建个人博客

Hexo+Gitee pages搭建个人博客

作者头像
你好戴先生
发布2020-09-02 10:17:18
1.4K0
发布2020-09-02 10:17:18
举报
文章被收录于专栏:戴言泛滥戴言泛滥

没有搭建过个人博客然后放弃的程序员不是好送外卖的


01

前言

本文仅仅针对有程序开发基础或有决心毅力的人,如果想点点按钮就搭建成功,那还是算了。

搭建个人博客有很多方法,可以自己购买服务器、购买域名、自己动手开发(或利用开源项目,比如Halo等)、部署搭建个人博客,但对于个人来说,成本还是相对较高。

Hexo是一款基于Node.js的静态博客框架,依赖少易于安装使用,可以方便的生成静态页面托管在GitHub、Gitee等平台上,是搭建博客的首选框架。

可能选用Github的更主流一些,但是在这里我选用的是码云(Gitee),主要原因是访问速度相对较快,github容易被墙,访问速度较慢。

02

准备工作

准备工作

帐号申请

一个Gitee码云帐号

简书帐号(编辑文章用,个人习惯)

本地开发环境

* Node.js

* Git

* Markdown编辑器

* windows电脑(以windows系统为例)

03

开始搭建

Gitee

[码云平台地址](https://gitee.com)

进入平台并注册一个帐号,并创建一个仓库

如果想最终发布的博客链接地址是http://xxxx.gitee.io这种格式的,建议注册码云帐号的用户名和仓库名都为xxxx。

比如我的码云用户名是daijiyong,创建了一个项目名为daijiyong,最终我的博客链接地址就是http://daijiyong.gitee.io

开发环境搭建

[NodeJs官网](http://nodejs.cn/)

[Git下载地址](https://git-scm.com/downloads)

均选择默认安装就行

安装Hexo

安装完NodeJs和Git,便可以开始安装Hexo了

创建博客目录

选择一个文件路径,创建一个文件夹,比如blog

进入blog文件夹,并右击鼠标右键,选择Git bash here

安装Hexo

在git bash界面依次执行如下命令进行Hexo的安装

代码语言:javascript
复制
npm install -g hexo-clihexo init

hexo会将这个文件夹初始化成一个博客专用文件夹,生成过程稍微要点时间,耐心等待。

初始化完成后,会有一个默认主题以及一个hello-word的默认文章。所以我们可以先生成博客来看一下效果,运行命令:

代码语言:javascript
复制
hexo generate //可以简写成 hexo g

然后hexo会开始生成博客,生成结束后,会多出一个public的文件夹,这个文件夹就是hexo生成的一个完整的静态网站,也就是我们的博客。网站生成好了,我们要浏览它,所以要开启一下服务器,运行命令:

代码语言:javascript
复制
hexo server //可以简写成 hexo s

然后打开浏览器,输入localhost:4000就可以浏览我们的博客了。

下载主题

在blog目录下右击鼠标,点击git bash here,并执行如下命令,速度可能有点慢,会在themes目录下生成一个新的文件夹Butterfly,即为新主题

代码语言:javascript
复制
git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/Butterfly

修改站点配置文件_config.yml(也就是blog目录下的_config.yml文件),把主题改为Butterfly

代码语言:javascript
复制
theme: Butterfly

之后执行如下命令,并在浏览器输入http ://localhost:4000,即可查看新主题样式

代码语言:javascript
复制
hexo s

如果有报错,为缺少依赖包,可根据[Butterfly主题配置文档](https://jerryc.me/posts/21cfbf15/#%E5%AE%89%E8%A3%9D)进行安装修补

修改配置

[Butterfly主题配置文档](https://jerryc.me/posts/21cfbf15/#%E5%AE%89%E8%A3%9D)

配置文档非常详细,可以根据配置文档一步一步完善和改进个人博客

发布部署

在站点编辑文件(blog根目录中的_config.yml文件)中新增或修改如下参数,其参数为你自己创建的码云仓库的参数

代码语言:javascript
复制
deploy:type: gitrepo: git仓库项目地址branch: 分支message: 自定义提交说明,这个字段可以没有

配置完之后执行如下命令,即可将编译的博客文件提交到码云的仓库

代码语言:javascript
复制
hexo clean && hexo deploy

如下图,依次点击服务-Gitee Pages,进入Pages服务页面

如下图,通过点击发布之后的链接,即可访问个人博客

04

博客维护

新增博客

在blog文件夹下右击鼠标,点击git bash here,执行如下命令

代码语言:javascript
复制
hexo new "文章名称"

会在source/_post目录下生成一个新的.md文件,即可编辑文章

我更喜欢通过简书编辑.md,因为图片可以直接拖拽,生成链接地址,编辑完成之后,直接将内容复制出来即可

删除博客

直接删除source/_post目录下对应的.md文件,重新启动程序就可以了

修改博客

修改对应的.md文件,重新发布程序即可

文/戴先生@2020年3月18日

---end---


本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2020-05-20,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 你好戴先生 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档