How to make a blog tutorial

第一部分：Hexo 安装

*参考：Hexo官方 文档 | Hexo

一、本地安装Git

Git国内下载镜像：CNPM Binaries Mirror (npmmirror.com)

Git安装教程：【Git】手把手教你在Windows系统下安装Git_自牧君的博客-CSDN博客_windows系统安装git

二、本地安装Node.js

Node.js国内下载镜像CNPM Binaries Mirror (npmmirror.com)

Node.js安装教程：Node.js安装及环境配置之Windows篇 - 周瑜周 - 博客园 (cnblogs.com)

三、本地安装Hexo

1.在D盘(可任意磁盘)目录下 新建文件夹 命名为 “blog” (可任意命名)

2.安装Hexo

在“blog” 文件夹根目录下右键Git Bash Here打开

输入命令 npm install -g hexo-cli 进行全局安装

输入命令 hexo -v 查看一下版本

3.初始化Hexo

依旧是在“blog”文件夹根目录下执行命令

输入命令hexo init 【默认安装在 blog目录下，也可以指定目录 命令为 hexo init xxx】

hexo init命令为安装hexo的基本配置文件

新建完成后，指定文件夹目录下有：

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

四、本地运行Hexo

以上一切正常后，接着输入命令（分别输入每行命令）

hexo g
hexo s

打开hexo的服务后，返回内容包含 INFO Hexo is running at http://localhost:4000/ . Press Ctrl+C to stop. 在浏览器输入 http://localhost:4000/ 可查看生成的博客

---

第二部分：Hexo主题切换

*注：以 Hexo & vivia 为例

一、安装 vivia 主题

1.方式

通过 npm 安装（推荐）

npm install hexo-theme-vivia

通过 Git 安装

# 将主题下载至 /themes/vivia 目录
git clone https://github.com/saicaca/hexo-theme-vivia.git themes/vivia
若通过 npm 安装，文件位于 node_modules/hexo-theme-vivia/example_zh_CN_config.vivia.yml
  
# 安装主题的依赖
npm install colorjs.io stylus hexo-symbols-count-time
若通过 Git 安装，文件位于 themes/vivia/example_zh_CN_config.vivia.yml

将example_zh_CN_config.vivia.yml文件复制一份到blog目录下将文件重命名为 _config.vivia.yml

此文件为vivia主题配置文件

2.切换主题

hexo config theme vivia

3.本地运行

以上一切正常后，接着输入命令（分别输入每行命令）

hexo g
hexo s

打开hexo的服务后，返回内容包含 INFO Hexo is running at http://localhost:4000/ . Press Ctrl+C to stop. 在浏览器输入 http://localhost:4000/ 可查看生成的博客

---

第三部分：Vercel 托管 Hexo

*参考：Vercel官网：Vercel

一.准备

1.注册Vercel（建议邮箱或者绑定Github平台账号）

二.本地下载配置文件

1.将 Vercel 下载到全局（npm i vercel -g）

三.登录 Vercel 账号

登录 Vercel 账号vercel login

这里登录的时候选择你注册vercel的方式

四.更新Hexo 到Vercel

更新本地网页：vercel --prod

---

第四部分：总结

一.更新文章

每次写完文章后在blog目录下右键Git Bash Here

执行hexo g 生成静态文件

如果vercel为登录状态 则直接执行vercel --prod 更新本地网页到Vercel

如果vercel为未登录状态 则先执行vercel login 进行登录 再执行vercel --prod