Hexo博客的搭建流程

阅读:167 - - 类别:《工具

这是之前使用Hexo搭建静态博客的教程。目前已经重新回到Wordpress平台,主要原因还是定制行强、耐玩。

本文从六个方面描述Hexo搭建博客的完整流程:

1. 安装Node.js

下载链接:http://nodejs.org/

2. 安装hexo

执行命令:npm install -g hexo

因为特殊的网络环境,安装的速度非常慢,而且极大的可能会失败。

解决办法:修改npm的安装源。

下面提供两种修改方式:

方式一,通过config命令:(亲自尝试,推荐使用)

命令行执行:

npm config set registry http://registry.cnpmjs.org
npm info underscore

方式二,通过命令:(未做尝试,不推荐)

npm -registry http://registry.cnpmjs.org info underscore

最后,重新执行命令:npm install -g hexo 直到安装成功。

3. 生成Hexo静态博客

  1. 选择博客文件的存放位置(以下以 C:\BlogFiles为例)
    • 进入C盘:cd C:
    • 创建文件夹BlogFiles:mkdir BlogFiles
    • 进入文件夹BlogFiles:cd BlogFiles
  2. 初始化博客
    • hexo init
      • 命令执行完成,在BlogFiles文件夹下添加以下内容:
        • node_modules: Hexo需要的nodejs组件
        • scaffolds:工具模板
        • source
          • _posts 文章文件夹
        • themes:主题文件
        • _config.yml:全局配置文件
  3. 生成静态页面并运行
    • 生成静态页面
      • 运行:hexo g (或者hexo generate)生成的静态内容存放在 public 文件夹下,此文件夹包含所有需要发布的内容
    • 运行查看效果
      • 运行:hexo s (或者 hexo server )在浏览器地址栏输入:http://localhost:4000 查看网站效果

4. 修改主题效果(个人风格爱好,我使用的是 NexT)

  1. 下载最新版本:https://github.com/iissnan/hexo-theme-next/releases
  2. 修改解压的文件,并把文件夹重命名为:next,放在themes文件夹下
  3. 修改主题配置文件:next/_config.yml
    • scheme: Mist
  4. 修改站点语言为:简体中文,在/_config.yml 文件里修改:language:zh-Hans
  5. 修改默认主题:为next,在/_config.yml 文件里修改:theme: next
  6. 设置菜单:在 next/_config.xml 中设置 menu: 菜单项,取消相应注释
  7. 添加RSS输出
    • 参考:http://hanhailong.com/2015/10/08/Hexo%E2%80%94%E6%AD%A3%E7%A1%AE%E6%B7%BB%E5%8A%A0RSS%E8%AE%A2%E9%98%85/
    1. 安装插件:hexo-generator-feed 命令:$ npm install hexo-generator-feed --save
    2. 修改站点配置文件_config.yml ,添加以下内容:
# Extensions
## Plugins: http://hexo.io/plugins/
#RSS订阅
plugin:
- hexo-generator-feed
#Feed Atom
feed:
type: atom
path: atom.xml
limit: 20
3. 修改主题配置文件 next/_config.yml 的rss字段值:rss: "/atom.xml"

5. 高频使用命令:

  • 清理Hexo的缓存,删除Public文件夹:$ hexo clean
  • 生成静态文件:$ hexo g

  • 启动测试模式:$ hexo s (模式端口号是:4000)

如果启动失败,请指定启动端口号:$ hexo s -p 3600 (使用3600端口)

6. 注意事项:

配置文件应严格遵守格式规范,我遇到过设置项前多一个或少一个空格报错的情况。不过,让人欣慰的是查看报错的详细信息,基本都可以定位到错误的位置。

评论已关闭!