Hexo+github搭建个人博客

环境准备

软件:git,node.js,hexo,markdown
下载并安装git,node.js,markdown,过程略。

常见问题

1、markdown安装完成后,如果使用过程出现如下异常,

An error occurred with the Html rendering component...

原因:MarkdownPad 2 在win10下 出现HTML 渲染错误(This view has crashed) 的问题.

解决办法:安装一个SDK的工具包,名叫:awesomium_v1.6.6_sdk_win

下载地址:awesomium

网络问题下载不了,则百度其他地址。

2、node.js在安装完成后,要设置下环境变量。

3、如果在cmd中执行命令出现异常,而异常信息又不够明确,可以尝试使用git bash来执行命令,比如hexo d命令在cmd中,会由于ssh key的问题抛异常,而在git bash中就会有明显提示。

安装hexo

开始安装hexo,在cmd中,利用 npm 命令即可安装。

> npm install -g hexo

搭建本地blog

提示安装完成后,开始创建个人blog目录。
(从这里开始,建议使用git bash执行命令)
创建blog目录

> mkdir blog && cd blog

然后执行

> hexo init

安装依赖包

> npm install

至此,本地blog基本文件准备完成,此时执行

> hexo g

生成静态页面,然后启动服务

> hexo server -p 5000

此处单独指定了端口号,因为hexo默认使用4000端口,有可能会和foxmail等其他服务端口有冲突。

启动成功后,会提示打开一个地址http://localhost:5000,如果页面显示正常,那么本地blog搭建完成。

部署blog到github

github提供了github.io功能,能够帮助我们展示静态的website。

操作步骤如下

1、操作前提:在github上注册账号、以github账号名创建一个仓库。

2、点击进入刚刚创建的仓库,点击settings进入管理页面。
3、找到GitHub Pages区域,选个一个主题,完成后点击页面提供的连接,就可以看到自己的blog页面,https://xxx.github.io
4、回到仓库页面,复制仓库地址ssh或者http方式按自己习惯
5、打开本地blog目录,编辑_config.yml文件
6、找到deploy配置项,修改如下,注意冒号后面有一个空格

deploy:
	type: git
	repository: 复制的仓库地址
	branch: master

7、接下来,回到你的cmd/git bash窗口,只需执行三个命令,命令不包含括号内信息: 

> npm install hexo-deployer-git --save (这命令是为了解决hexo新版本的部署问题)

> hexo g 回车 (这是重新生成blog)
 
> hexo d 回车 (这是将本地blog部署到github的仓库)

8、再次访问“xxx.github.io”,此时,你应该能看到hexo的欢迎页面。

配置主题

1、打开主题地址
2、列表的右侧demo连接,是效果图,左侧连接为主题的git仓库
3、选择一个喜欢的主题后,进入它的git仓库,将其clone到本地blog目录的themes目录下,执行如下命令

> git clone 主题仓库地址

或,在blog目录下执行
> git clone 主题仓库地址 themes/自定义目录名

下载完成后,得到的目录比如为: /themes/mythemes 

4、编辑_config.yml文件,找到themes配置项,修改为

theme: mythemes

5、重新编译blog并上传到git:

> hexo g
> hexo d

执行完下面命令后,刷新xxx.github.io,可能有延迟。

编写与发布blog

在blog目录的/source/_posts/,就是用于发表的博文目录。
使用markdown创建好博文后,复制到该目录下,在执行上一节的第5步,就可以将博文上传到github上。

至此,个人blog搭建完成。建议备份本地blog目录,防止源文件丢失。


参考:

http://www.cnblogs.com/dantefung/p/d8c48ba8030bcab7cfc364d423186fee.html

https://hexo.io/docs/server.html

http://ibruce.info/2013/11/26/markdown/

https://blog.csdn.net/geekqian/article/details/78342581

https://blog.csdn.net/weixin_40426638/article/details/80336881

 

当然如果对您有帮助,您也可以更加直白的感谢一下;您的支持是我最大的动力。 

你可能感兴趣的:(github,杂项,hexo,个人博客,github)