关于如何创建属于自己的博客呢？其实在今日之前，我也不清楚！

说来惭愧，作为一名有三年前端经验的开发者来说不会这个确实有点尴尬 ~ 今天得亏隔壁前端大佬在更新博客，于是乎我就跟着操作了一遍，这里呢，做个学习记录，也算做是我的个人博客第一篇内容了！！！ 下面直接捞干货：

一、什么是Hexo?

Hexo是一款基于Node.js的静态博客框架，依赖少易于安装使用，可以方便的生成静态网页托管在GitHub和Heroku上，是搭建博客的首选框架。这里我们选用的是GitHub,Hexo同时也是GitHub上的开源项目.

二、环境安装

1. 安装 node 跟 npm（开发电脑基本都会有配置，如不会烦请百度！）

2. 安装 hexo

   1	cnpm install -g hexo-cli

3. 安装后验证hexo

   1

   hexo -v

4. 使用 hexo 搭建 blog

   (1).创建一个空白 dir, 并进入到该 dir, 比如

   1

   zx-hexo

   (2).在 zx-hexo 目录下, 初始化 blog

   1

   hexo init

   (3).本地启动 blog, 主要是本地预览文章用 (按下 ctrl+c 即可停止)

   1

   hexo s

   (4).使用下述网址即可访问本地部署的 hexo 博客

   1	http://localhost:4000

   (5).在 zx-hexo 目录下, 安装上传图片到 github 的插件

   1	cnpm install https://github.com/CodeFalling/hexo-asset-image --save

   (6).同时修改 zx-hexo 目录下, _config.yml文件配置

   1	post_asset_folder:true

   (7). 其中hexo clean:清理目录 hexo g:重新生成 hexo s: 再次启动，预览即可看到

   (8). 如果要用到其他的主题，可以在hexo官网的主题中挑选合适的主题使用，具体使用步骤根据主题配置说明走就可以了https://hexo.io/themes/

三、更换主题

1. 假设要更换的主题是 maupassant

   1	https://www.haomwei.com/technology/maupassant-hexo.html

2. 在 zx-hexo 目录下, 依次执行命令:

   1 2 3

   git clone https://github.com/tufu9441/maupassant-hexo.git themes/maupassant cnpm install hexo-renderer-pug --save cnpm install hexo-renderer-sass --save

3. 编辑 zx-hexo 目录下的 _config.yml 文件, 将theme的值改为maupassant

   1	theme: maupassant

4. 依次执行命令

   1 2 3

   hexo clean hexo g hexo d

四、将hexo放到github仓库上

​

​ 完成了hexo的安装后, 我们只能在本地访问. 因此我们将它放到github上, 方便我们随时随地的用网址访问。

1. Blog文件夹目录下输入: cnpm install –save hexo-deployer-git 用来安装git部署的插件

2. GitHub上去建一个repository. 注意名字只能是” github账户名.github.io “.

3. 置_config.yml. 在Blog目录下找到_config.yml使用vscode或者sublime等编辑器打开.按照如下配置Deployment:

   1 2 3 4

   deploy: type: git repo: https://github.com/wowangmouren/wowangmouren.github.io branch: master

4. 输入: hexo d 来将hexo部署到github. 中途会让你输入你的github用户名和密码. 输入就行.

5. 成功后就可以在浏览器输入github用户名.github.io来进入自己的博客了.