Hexo博客搭建指南

2017-10-17  本文已影响0人  HeeeJianBo

最近熟悉的各路大神都纷纷从 Ghost 迁移为 Hexo。 好奇之下,在简单对比过后也选择了Hexo,主要是基于以下的两点考虑

  1. Hexo 直接使用 Markdown 文件在命令行生成博客、命令行进行部署; 更简洁方便
  2. Hexo 原生支持中文; 当然 Ghost 的话也可以使用 Ghost中文网

本文只适用于 macOS; 其他平台仅供参考

Hexo 安装

安装 NodeJs

首先,由于 Hexo 依赖于 NodeJs,所以需要先安装 Node,如果已经安装直接跳过。

使用安装包安装

  1. 前往 https://nodejs.org/en/
  2. 下载 LTS 版本安装包(目前是 v6.11.3 LTS)
  3. 完成后、直接打开App点击安装就好

使用brew安装

打开终端执行以下命令

# 安装 brew
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

# 安装 nodejs
brew install nodejs

完成安装后,打开终端执行 npm --versionnode --version 没报错证明 NodeJs 已成功安装

安装 Hexo

NodeJs安装完成后,执行以下步骤安装 Hexo 并创建一个博客工程。

# 安装 hexo 
npm install hexo-cli -g

# 初始化博客工程
cd ~/Desktop
hexo init blog

# 安装npm模块、
cd blog
npm install

# 启动博客网站
hexo server

执行完最后一步,并输出以下内容。就代表一个完整Hexo博客搭建就大功告成了!打开 http://localhost:4000/ 体验下劳动成果吧!

JianBoPro:blog JianBo$ hexo server
INFO  Start processing
INFO  Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.

原文参考: https://hexo.io/zh-cn/

新建文章

如文章开头提到的,Hexo 使用终端命令进行操作,新建一条博客的也是如下:

# 仍然先进入到博客目录
cd blog

# 新建一条名为 hello 的博客
hexo new hello

# 再次启动博客网站
hexo server

原文参考: https://hexo.io/zh-cn/docs/writing.html

更改主题

Hexo 官方本身提供大量的主题供大家使用,而且很大一部分都支持中文。前往官方主题市场

本文以当前博客使用的主题 confidante 为例:

# 先找到主题的源码地址
# 在签出主题代码到 博客的 themes 路径
git clone https://github.com/JakeLaoyu/hexo-theme-confidante themes/confidante

# 切换主题
#  修改根目录下 _config.yml 文件
theme: confidante

# 再次启动博客网站
hexo server

以上命令执行完成后,浏览器打开 http://localhost:4000 就可以看到新的主题效果了

ps: 如需修改主题里的其他内容,可以看看 themes/confidante/_config.yml 文件里面配置

到目前为止,Hexo的安装使用基本都完成了

部署

接下来是Hexo的部署,在本地博客搭建后,需要把生成的静态页面部署到公网服务器,才能供其他人访问到你的博客。而一般大家常用到有俩种的方式

  1. 部署至Github。优点是免费,缺点是域名为 xxx.github.io
  2. 用 Nginx 部署在私有服务器上。缺点是需要自己购买服务器、域名等

部署至Github

  1. 建一个名为 username.github.io 的仓, 如下图所示:
create-repos.png
  1. 开启 Github Pages 进入到代码仓主页、点击 Setting 进入到设置页面,下拉滚动到 Github Pages 设置的地方、点击 Choose a theme
enable-github-pages-1.png

跳转页面后,然后直接点击 Select theme 完成选择主题选择。然后会跳转另一个页面,直接拉到底部点击 Commit 完成代码仓的首次提交。
完成后再次进入 Setting 页面、看到 Your site is ready to be published at https://hjianbo.github.io/. 证明 Github Pages 功能已成功开启。

enable-github-pages-2.png
  1. 配置 Github SSH免密提交代码

  2. 配置部署
    先在本地工程中安装 Github 部署用的支持工具

# 工程目录下执行
npm install hexo-deployer-git --save

然后打开 _config.yml,将文件尾部的 deploy 部署部分改为:

deploy:
  type: git
  repository: git@github.com:{youname}/{youname}.github.io.git
  branch: master

编辑完成,保存。在工程目录下中执行 hexo d -g 进行发布部署。

等待文件上传至Github成功,部署就全部完成了!! 尝试在浏览器中打开前面 步骤2 中给你的地址看看博客的效果吧!!

部署至私有服务器

  1. 首先我们得有自己的一台 Linux 服务器。推荐: Vultr
  2. 配置服务器的免密SSH登录
  3. 在服务器端安装 Nginx。并建立博客路径
  4. 在服务器端安装 rsync
  5. 本地配置部署方式

安装 hexo-deployer-rsync

npm install hexo-deployer-rsync --save

修改本地 _config.yml 配置

deploy:
   type: rsync
   host: hjianbo.me
   user: root
   root: /var/www/blog
  1. 工程中执行 hexo d -g

常见问题

Q: 怎么显示图片?
A: http://www.jianshu.com/p/c2ba9533088a

上一篇下一篇

猜你喜欢

热点阅读