前言

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

本文介绍通过Hexo框架快速搭建个人博客，并部署到Gitee Pages服务部署博客。

环境的安装

安装地址

GIT安装

安装步骤：双击下载好的exe文件，一路点击next就好了。

1
2
git bash // 运行
git version // 查看版本

能看到版本号就说明你安装成功了，之后的命令都是在这里运行的。

Node.js安装

安装步骤：双击下载好的msi文件，也是一路下一步就好了。

1
2
node -v // 查看node.js版本
npm -v // 查看npm版本

Hexo安装

安装cnpm

淘宝镜像：利用npm工具来安装一个cnpm工具(国内的淘宝npm镜像源)，提升下载各种包的速度。

1
npm install -g cnpm --registry=https://registry.npm.taobao.org

后面所有的命令npm换成cnpm

安装Hexo

1
2
3
4
// 全局安装Hexo包
cnpm install -g hexo-cli
// 查看版本号
hexo -v

这里所需的环境和包已近安装完成，接下来就是搭建博客

初始化Hexo

  1. 在Git Bash中进入新建的文件件中

  2. 输入Hexo初始化命令hexo init

  3. 初始化完成之后文件夹中出现以下文件：

    • node_modules: 依赖包
    • public：存放生成的页面
    • scaffolds：生成文章的一些模板
    • source：用来存放你的文章
    • themes：主题
    • _config.yml: 博客的配置文件

  4. 打开Hexo服务

    1
    2
    3
    4
    5
    // 运行项目
    hexo s
    // 运行后出现（浏览器访问http://localhost:4000）
    INFO  Start processing
    INFO  Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.

使用Ctrl+C可以关闭服务

如果你的项目运行不起来或者一些包没下载完，可以选择将node_modules文件夹删除，再次cnmp i下载集成的包。

  1. Hexo写一篇博客

    1
    2
    // 命令""中是文档名称
    hexo n "我的第一篇博客"

  2. /source/_posts/我的第一篇博客.md编辑文档，重启Hexo服务

    1
    2
    3
    hexo clean     // 清除所有记录----简写：hexo cl
    hexo generate  // 生成静态网页----简写：hexo g
    hexo server    // 启动服务----简写：hexo s

博客部署到Gitee上

  • Gitee官网上新建仓库

踩坑：仓库名字必须为你Gitee设置/个人资料/个人空间地址的名称一样，（注意不是你的Gitee姓名）否者部署上去会出现样式丢失的Bug

  • 打开Hexo的配置文件_config.yml

    1
    2
    3
    4
    5
    // repo为你的仓库的url，我这里使用的是ssh地址
    deploy:
      type: git
      repo: git@gitee.com:giteemoxie/giteemoxie.git
      branch: master

踩坑：注意你的配置文件中的url地址：

如果不是你的博客地址会出现问题，推送失败的bug或者部署出错的bug。

1
2
// 例如：
url: https://githubmoxie.github.io

  • 安装一个Hexo插件

    1
    2
    3
    4
    // cpnm安装git推送插件
    cnpm install hexo-deployer-git --save
    // 上传到gitee的远端仓库
    hexo d

Git教程请看另外文章Git使用教程

  • 上传成功后，仓库里卖点击上面的服务，找到Gitee Pages进行部署

注意：每次更改网页重新上传到仓库都要到这里来更新服务

参考