Hexo快速搭建个人博客，并发布到github pages

Hexo快速搭建个人博客，并发布到github pages

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。

一、全局安装 Git ，Nodejs ， Hexo

git及nodejs安装教程 忽略

hexo安装

1

$ npm install -g hexo-cli

安装完成后在命令行输入 hexo 看一下命令是否存在，如果不存在，可能是需要配置一下环境变量。

二、开始建站

安装完成 hexo 之后执行下面的命令

1

$ hexo init <folder>

2

$ cd <folder>

3

$ npm install

1

.

2

├── _config.yml

3

├── package.json

4

├── scaffolds

5

├── source

6

|   ├── _drafts

7

|   └── _posts

8

└── themes

_config.yml

网站的 配置 信息，您可以在此配置大部分的参数。

如果后面要发布到github上 要填写 url 这个参数为github pages 地址

package.json

应用程序的信息。

scaffolds

模版 文件夹。当您新建文章时，Hexo 会根据 scaffold 来建立文件。

Hexo的模板是指在新建的文章文件中默认填充的内容。例如，如果您修改scaffold/post.md中的Front-matter内容，那么每次新建一篇文章时都会包含这个修改。

source

资源文件夹是存放用户资源的地方。除 posts 文件夹之外，开头命名为 (下划线)的文件 / 文件夹和隐藏的文件将会被忽略。Markdown 和 HTML 文件会被解析并放到 public 文件夹，而其他文件会被拷贝过去。

themes

主题 文件夹。Hexo 会根据主题来生成静态页面。

三、启动项目

server 指令启动网站项目

1

$ hexo server

generate 指令生成静态文件

1

$ hexo generate --watch //参数是监控文件变动自动生成静态文件的

四、部署项目

首先去github上面创建两个仓库，一个仓库存放本项目，叫地址A，另一个项目存放生成的博客静态文件，叫地址B。

安装 hexo-deployer-git

首先安装 hexo-deployer-git 后面一键发布到github pages要用

1

$ npm install hexo-deployer-git --save

1

deploy:

2

  type: git

3

  repo: <repository url> 地址B

4

  branch: [branch]

5

  message: [message]

推送本项目

把本项目推到地址A上步骤如下

1

$ git init // git初始化

2

$ git add . // 添加所有变动

3

$ git commit -m xxxx // commit 代码

4

$ git remote add origin 地址A // 本地代码与远程仓库关联

5

$ git push origin master // 推到远程仓库

新建一篇文章

1

$ hexo new <title>

此处新建的时候。title 最好是英文的标题，如果_config.yml配置的路由规则（即permalink）是默认值 :year/:month/:day/:title/ ，那么进入文章后路由就有中文了，有中文使用 gitment 评价系统时，登陆 github 账号会出现 404 问题。

发布博客

运行下面的命令
清除缓存文件 (db.json) 和已生成的静态文件 (public),并将 public中的博客静态文件推送到地址B上。

1

$ hexo clean && hexo deploy

过一会去 地址B 中的setting 的 GitHub Pages 的网址上去查看发布的博客即可。

五、切换主题

hexo主题网站上面有很多的主题可以选择，找到选中主题的github地址，切换主题具体操作需要看每个主题的ReadMe即可。如果自己要修改东西也可以进入themes目录下去调整相关代码。

六、引入husky

由于博客的静态文章和项目的代码是分开两个仓库存放的，所以每次发布文章后，还需要把代码推到仓库中，引入husky就是利用git hooks配置预处理脚本。在项目commit后，直接发布文章，也就是把博客静态文件推送到远程仓库。

1. 安装husky

   1	$ npm install --save-dev husky

2. package.json中，与“scripts“并列，添加如下内容：

   1	"husky": {
   2	"hooks": {
   3	"pre-commit":"npm run clean && npm run deploy"
   4	}
   5	},

• ← Previous Post
• Next Post →

欢迎访问 xiaopf 的博客, 若有问题或者有好的建议欢迎留言，笔者看到之后会及时回复。 评论点赞需要github账号登录，如果没有账号的话请点击 github 注册， 谢谢 !