本博客(旧版本)是基于Hexo生成的静态页面。这不免让人想起,常被提起的个人博客发展轨迹:第三方专业博客平台→搭建独立博客→极简静态页面。而我也正是从QQ空间到百度空间再到搭建独立的WordPress,现在则是使用Hexo托管到又拍云。

记忆有限,下面记录一下本次博客的搭建流程:

1. 安装Node.js

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

2. 安装hexo

执行命令:npm install -g hexo

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

  • 解决办法:修改npm的安装源。下面提供两种修改方式:
  1. 通过config命令:(亲自尝试)
  • npm config set registry http://registry.cnpmjs.org
  • npm info underscore
  1. 通过命令:(未做尝试)
  • 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
  1. 初始化博客
  • hexo init- 命令执行完成,在BlogFiles文件夹下添加以下内容:- node_modules: Hexo需要的nodejs组件- scaffolds:工具模板- source:- _posts 文章文件夹- themes:主题文件- _config.yml:全局配置文件
  1. 生成静态页面并运行

    • 生成静态页面

    • 运行: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输出

    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. 注意事项:

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


本文为原创文章,转载请注明出处!欢迎关注任前程博客 https://renqiancheng.com/,第一时间看后续精彩文章。