使用hexo搭建个人博客
2020-07-05 本文已影响0人
suxin1932
title: 使用hexo搭建个人博客
toc: true
1.软件安装
1.1 下载并安装 node.js
1.1.1 下载地址
https://nodejs.org/en/
1.1.2 安装后验证
node -v
1.2 安装 cnpm
1.2.1 安装命令
npm install -g cnpm --registry==https://registry.npm.taobao.org
1.2.2 安装后验证 cnpm
cnpm -v
1.3 安装 hexo
1.3.1 安装命令
cnpm install -g hexo-cli
1.3.2 安装后验证 hexo
hexo -v
2.使用 hexo 搭建 blog
2.1 创建一个空白 dir, 并进入到该 dir, 比如
zx-hexo
2.2 在 zx-hexo 目录下, 初始化 blog
hexo init
2.3 本地启动 blog, 主要是本地预览文章用 (按下 ctrl+c 即可停止)
hexo s
使用下述网址即可访问本地部署的 hexo 博客
http://localhost:4000
2.4 在 zx-hexo 目录下, 安装上传图片到 github 的插件
cnpm install https://github.com/CodeFalling/hexo-asset-image --save
同时修改 zx-hexo 目录下, _config.yml文件配置
post_asset_folder:true
2.5 在 zx-hexo 目录下执行命令 'hexo n'新建一篇 blog, 进入该blog目录, 并用 md 工具比如(typora) 编辑该文章
E:\Programming\zx-hexo>hexo n "使用hexo搭建个人博客"
INFO Created: E:\Programming\zx-hexo\source_posts\使用hexo搭建个人博客.md
>> 可以发现该source目录下被新建了一个 文件及文件夹
使用hexo搭建个人博客.md
使用hexo搭建个人博客
>> 在该文件中存放图片, 并在 md文件中引用即可
<img src="使用hexo搭建个人博客/xunlei.png" style="zoom:50%;" />
2.6 然后重新回到 zx-hexo 目录, 清理一下目录
hexo clean
2.7 重新生成
hexo g
2.8 再次重启, 预览即可看到
hexo s
3.将 blog 部署到 github 个人主页上
3.1 在 zx-hexo 目录下安装 hexo-deployer-git
cnpm install --save hexo-deployer-git
3.2 编辑 zx-hexo 目录下的 _config.yml 文件, 在文件末尾添加如下内容
deploy:
type: git
repo: https://github.com/abc/abc.github.io.git
branch: master
其中 repo 中的内容即为 github 个人主页链接地址, 关于如何创建 github 个人主页, 可自行百度即可
3.3 在 zx-hexo 目录下, 将本地 blog 推送到 git 仓, 可能需要输入 username & pwd
hexo d
3.4 推送成功后, 在浏览器中输入对应域名, 即可访问
https://abc.github.io
4.更换主题
4.1 假设要更换的主题是 maupassant
https://www.haomwei.com/technology/maupassant-hexo.html
4.2 在 zx-hexo 目录下, 依次执行命令:
git clone https://github.com/tufu9441/maupassant-hexo.git themes/maupassant
cnpm install hexo-renderer-pug --save
cnpm install hexo-renderer-sass --save
4.3 编辑 zx-hexo 目录下的 _config.yml 文件, 将theme的值改为maupassant
theme: maupassant
4.4 依次执行命令
hexo clean
hexo g
hexo d
4.5 再次在浏览器中输入对应域名, 即可发现主题已更换(可能会有几分钟延迟)
https://abc.github.io