如何快速搭建hexo博客

hexo 是一个快速、简洁且高效的博客框架。hexo 使用 Markdown解析文章，在几秒内，即可利用靓丽的主题生成静态网页。hexo是一款基于Node.js的静态博客框架，依赖少易于安装使用，可以方便的生成静态网页托管在GitHub Page、COS（腾讯云对象存储）等支持静态网站的系统上，是搭建博客的首选框架。

本文将简介如何自己的服务器、腾讯云COS及Github Page上部署hexo博客。先说结论，如果你在国内使用博客的话，本文推荐你在COS上部署，首先是不用自己搭建静态网站服务器，其次是免费，这里的免费额度优惠很大，每月50G免费空间，10G CDN下行流量，每月100万次读写请求。对于一个静态网站或者个人博客来说，非常够用了。当然，你也可以使用Github Page和自己的服务器，但是这里会遇到一些问题，比如使用Github Page国内访问速度慢甚至无法加载报错456的情况。而使用自己的服务器，撰写部署又成为一大难题。

本地部署hexo开发环境

安装之前，需要你电脑安装好Node.js和Git，由于系统花样繁多，本文将仅介绍Windows、Mac、Ubuntu(linux)安装方法，其他系统请自行摸索。

Node.js及git的安装

windows中Node.js及Git的安装中Node-js及Git的安装)

  • Node.js

打开Node.js的官网，点击8.12.0 LTS绿色按钮（本文撰写时的版本），下载好后一路下一步安装即可。

  • Git

打开Git官网，点击Download 2.19.1 for Windows（本文撰写时的版本）按钮，下载好后一路下一步安装即可。

Mac中Node.js及Git的安装

  • Node.js

打开Node.js的官网，点击8.9.4 LTS绿色按钮（本文撰写时的版本），下载好后一路下一步安装即可。

  • Git

Mac默认自带Git，若您系统版本过低，请打开Git官网下载安装。

Ubuntu中Node-js及Git的安装

  • Node.js

命令窗口输入以下命令

1
2
3
4
5
6
7
8
9
10
sudo apt-get update
sudo apt-get install -y python-software-properties software-properties-common
sudo add-apt-repository ppa:chris-lea/node.js
sudo apt-get update
sudo apt-get install nodejs
sudo apt install nodejs-legacy
sudo apt install npm
sudo npm install n -g
sudo n stable
sudo node -v

如遇到安装错误或其他问题，请使用编译安装。

为保证nodejs版本及稳定性，下面安装是下载nodejs进行编译安装，可能耗时较长，请耐心等待。如您上面执行sudo node -v已经正常显示版本，则不用执行下面的代码。

1
2
3
4
5
6
sudo git clone https://github.com/nodejs/node.git
sudo chmod -R 755 node
cd node
sudo ./configure
sudo make
sudo make install
  • Git

Ubuntu安装git，执行以下命令即可安装

1
sudo apt-get install git

hexo的安装

接下来，我们需要在本地安装hexo，hexo安装命令非常简单，只需要一步即可安装完成，具体命令窗口输入以下命令：

1
sudo npm install -g hexo-cli

但是值得注意的是，Windows必须去掉sudo命令即npm install -g hexo-cli，windows如何打开命令窗口请点击这里学习。Ubuntu和Mac仍使用上述命令安装即可。

如何建站

安装完Hexo等相关依赖后，请执行以下命令创建您的网站

1
2
3
sudo hexo init <folder>
cd <folder>
sudo npm install

同上，Windows须去掉sudo命令，Ubuntu和Mac仍使用上述命令安装即可。其中&lt;folder&gt;为你需要创建的网站的文件夹名称，名称无硬性要求，如我创建自己的网站，则可写为sudo hexo init techeek

没错，这样就完了，你的网站已经搭建完成。更多相关的命令解释请点击这里查看。

如何写文章

首先我们需要创建一个新的文章，默认Hexo已经为我们写了一篇为Hello Word的文章，但是为了熟悉撰写文章的过程，我们还是重头撰写一遍。

首先在您的命令窗口输入以下命令

1
sudo hexo new <title>

同上，Windows须去掉sudo命令，Ubuntu和Mac仍使用上述命令安装即可。其中&lt;title&gt;为你需要创建的文章的名称，名称无硬性要求，如我创建自己的文章，则可写为sudo hexo init hexo-tutorial

这时，找到你创建的网站目录中创建markdown源文件的地方，位置在你创建网站的名称\source\_posts下，双击编辑该文件，打开后markdown格式如下：

1
2
3
4
5
6
---
title: 这块写你文章的名称
date: 这块为创建文章的时间，可修改，格式为：年-月-日 时:分:秒
tags: [这块写你文章的标签，使用“,”隔开（注意去掉引号须包含中括号）]
---
这块写你的正文

如本文格式

1
2
3
4
5
6
---
title: 如何快速搭建hexo博客
date: 2018-10-18 14:47:02
tags: [hexo,git,同步]
---
hexo 是一个快速、简洁且高效的博客框架。hexo 使用 Markdown解析文章，在几秒内，即可利用靓丽的主题生成静态网页。hexo是一款基于Node.js的静态博客框架，依赖少易……

部署hexo到腾讯云COS

既然比较推荐部署到腾讯云COS，那么我们就先看看如何将hexo部署在腾讯云的COS上。在开始之前，我们要做一些准备，要在腾讯云COS上创建存储桶，并设置好静态网站环境，这里可以参考**如何通过 cos 托管静态网站**这个教程。

创建并设置好环境后，还需要获取腾讯云COS相关密钥才能部署，这里我们需要获取APPID，SecretId，SecretKey，Bucket，Region这五个参数，具体如下：

名称 描述
APPID 开发者访问 COS 服务时拥有的用户维度唯一资源标识，用以标识资源
SecretId 开发者拥有的项目身份识别 ID，用以身份认证
SecretKey 开发者拥有的项目身份密钥
Bucket COS 中用于存储数据的容器，本文创建以www为例
Region 域名中的地域信息。枚举值参见可用地域 文档，如：ap-beijing, ap-hongkong, eu-frankfurt 等

获取这些值后，我们需要安装能将HEXO部署在COS上的插件，这里我们选择安装hexo-deployer-cos，安装比较简单，只需要执行npm install hexo-deployer-cos --save即可，具体如下。

1
npm install hexo-deployer-cos --save

](http://)

接下面我们配置hexo的配置文件，首先打开根目录的_config.yml配置文件，将原来的deploy替换为下面的内容：

1
2
3
4
5
6
7
deploy: 
  type: cos
  appId: yourAPPID
  secretId: yourSecretId
  secretKey: yourSecretKey
  bucket: yourBucketName-yourAPPID
  region: yourRegion

细心的同学发现我的配置与hexo-deployer-cos的Github项目页面给出的配置不同，为什么呢？该插件作者更新了插件，但是没更新Readme文档，用原作者的配置文件会报错。所以请用我给出的配置。那么具体配置如下。

假如说我的APPID是1251234567，secretId是ABCDEFGHIGKLMNOPQRSTUVWXYZ，secretKey是abcdefghijklmnopqrstuvwxyz，创建的bucket是www，region可用地区是成都，也就是ap-chengdu，这个详见准备的表格。

那么我的_config.yml中deploy配置为：

1
2
3
4
5
6
7
8
9
......
deploy: 
  type: cos
  appId: 1251234567
  secretId: ABCDEFGHIGKLMNOPQRSTUVWXYZ
  secretKey: abcdefghijklmnopqrstuvwxyz
  bucket: www-1251234567
  region: ap-chengdu
......

现在你已经完成了最后的设置，最后一步就是需要部署项目到COS了，输入我们熟悉的部署命：

1
hexo g -d

你会看到如下输出：

1
2
3
4
5
6
7
8
9
10
11
INFO  Start processing
INFO  Generating Baidu urls for last 1 posts
INFO  Posts urls generated in baidu_urls.txt
https://www.techeek.cn/2018/08/14/Ubuntu-DTS-translation/
INFO  Files loaded in 1.24 s
INFO  Generated: sitemap.xml
......
INFO  成功上传:E:\Desktop\临时\git\www.test.com\public\2016\06\05\Workerman-Tcp\index.html
INFO  成功上传:E:\Desktop\临时\git\www.test.com\public\2017\03\09\docker-lnmp-typecho\index.html
INFO  成功上传:E:\Desktop\临时\git\www.test.com\public\2016\09\28\dontstarve-server\index.html
......

好了，现在我们访问你的域名看看是否上传成功了？在浏览器打开https://www.test.com

我们看到项目已经上传，我们在打开COS的Bucket，看看是不是网站真的在Bucket上。

我们看到，服务器在COS运行成功了。

部署在Github Page

创建Github仓库

首先你需要创建并登录Github账户，点击这里注册，然后点击GitHub中的New repository创建新仓库。仓库名称必须命名为你的GitHub用户名.github.io，其中“你的GitHub用户名”使用你的github账户代替，比如我的仓库名称为techeek.github.io，这样，你就创建好你的Github Pages仓库了。

生成ssh密钥文件

接下需要创建ssh密钥文件，为什么要创建呢，因为Hexo部署在github上是通过密钥配对上传的，所以我们需要创建公钥和私钥，什么是公钥和私钥请点这里。我们首先依然打开命令提示符，Windows请搜索打开Git Bash。然后输入如下命令配置git

1
2
git config --global user.name "你的GitHub用户名"
git config --global user.email "你的GitHub注册邮箱"

配置完成后，输入如下命令生成ssh密钥文件

1
ssh-keygen -t rsa -C "你的GitHub注册邮箱"

接下来按三下回车就行，不创建密码，然后我们使用

1
cd ~/.ssh

命令打开ssh生成的密钥文件，Windows密钥文件在C:/Users/你的用户名/.ssh目录下。接下来打开GitHub_Settings_keys 页面，新建new SSH Key。Title为标题，任意填写。将刚刚复制的id_rsa.pub内容粘贴到key，最后点击Add SSH key。

部署网站

部署前需要修改Hexo的配置文件，这里先放出官方的配置方法，大家可以参考。我这里只讲如何配置git
修改_config.yml内容如下

1
2
3
4
5
6
7
8
......
  eployment
  Docs: https://hexo.io/docs/deployment.html
  ......
  deploy: 
    type: git
    repo: git@github.com:你的GitHub用户名/你的GitHub用户名.github.io.git
    branch: master

很多教程都将repo:写为https://github.com/你的GitHub用户名/你的GitHub用户名.github.io.git但是我个人不推荐这样写，因为有时候会因为BUG无法上传，所以我建议按照我上面的格式写。

这是执行如下命令，就可部署你的网站了

1
sudo hexo deploy

部署完成后，打开https://你的GitHub用户名.github.io.git看看是不是能正常访问啦？

部署在自己的服务器

可以按照第一步的步骤在自己的服务器上提前安装好Node.js和Git，接下来在本地部署好hexo博客，撰写好文章。最后生成静态文件。当静态文件生成好之后我们需要使用如下命令部署网站，命令如下

1
2
sudo hexo deploy
sudo hexo server

启动服务器。默认情况下，访问网址为： http://localhost:4000/，或访问你的服务器地址 http://你的服务器IP:4000/。如果使用的是腾讯云的服务器，请打开安全组的4000端口。

总结

部署hexo网站很简单，推荐在Windows部署完成后部署在COS上，因为有cdn的加持，访问速度会快很多，况且有那么多免费流量，个人博客使用足矣。建议将hexo的项目文件同步到Git上，这里我推荐腾讯Git代码托管（工蜂），为开发者提供基于 Git 的在线代码托管工具，包含代码提交/存储/下载/复刻/分支/历史/比对/合并等功能。可一站式完成对代码及代码质量管理，项目及项目人员管理，大大提升研发效率。而且支持免费的私有仓库，将hexo项目同步上去，后续哪怕是更换电脑也能快速更新博客并控制版本。

Usage: hexo

Commands:

1
2
3
4
5
6
7
8
9
10
11
12
13
clean     Remove generated files and cache.
  config    Get or set configurations.
  deploy    Deploy your website.
  generate  Generate static files.
  help      Get help on a command.
  init      Create a new Hexo folder.
  list      List the information of the site
  migrate   Migrate your site from other system to Hexo.
  new       Create a new post.
  publish   Moves a draft post from _drafts to _posts folder.
  render    Render files with renderer plugins.
  server    Start the server.
  version   Display version information.

Global Options:

1
2
3
4
5
6
--config  Specify config file instead of using _config.yml
  --cwd     Specify the CWD
  --debug   Display all verbose messages in the terminal
  --draft   Display draft posts
  --safe    Disable all plugins and scripts
  --silent  Hide output on console

For more help, you can use ‘hexo help [command]’ for the detailed information or you can check the docs: hexo