windos系统下hexo+github搭建简单静态个人博客

windos系统下hexo+github搭建简单静态个人博客

一、环境node.js

1.安装git

首先登陆Git官网：https://git-scm.com/

速度慢可通过淘宝镜像下载：http://npm.taobao.org/mirrors/git-for-windows/

1.点击Download下载

2.选择版本默认64bit

3.点击安装程序

4.进入安装界面（可直接选择默认，一路next）

5.安装完成

到此，Git的安装完成，可以在开始菜单中看到Git的三个启动图标：Git Bash、Git CMD(Deprecated)、Git GUI。
Git Bash，是Git配套的一个控制台。
Git CMD(Deprecated)，是通过CMD使用Git（不推荐使用）。
Git GUI，是Git的可视化操作工具，点击打开如下图：

6.cmd查看版本

2.安装node.js

下载nodejs: https://nodejs.org/en/ 一般下载安装最新稳定版本

1.下载

2.安装一路next就ok

安装完以后会有两个组件：1.是 npm 包管理器；2.是 Nodejs 本身。

3.查看版本

二、hexo框架

需借助 npm 包管理器来安装。

因为国内安装镜像源很慢，所以利用 npm 安装 cnpm。

用淘宝链接进行安装：

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

1.看下 cnpm 的版本：cnpm -v

2.安装hexo框架：cnpm install -g hexo-cli

3.查看版本：hexo -v

这里注意，若执行C:\Users\Lenovo> hexo -v

报错：'hexo' 不是内部或外部命令，也不是可运行的程序
或批处理文件。

处理方法1：配置环境变量-----将 hexo.cmd的根目录添加到系统变量中的path变量中。

处理办法2：直接将 hexo.cmd 文件拖拽到 运行窗口内 或者 直接使用该根目录"D:\react native\node-v10.15.3\node_cache\hexo.cmd"代替hexo。

如hexo -v 写成 "D:\react native\node-v10.15.3\node_cache\hexo.cmd" -v（"D:\react native\node-v10.15.3\node_cache\hexo.cmd" 是hexo.cmd的根目录）

4.本地启动 hexo搭建的博客

方法1：通过命令行创建blog文件

查看当前路径，输入：cd

新建一个blog 文件夹，输入 : mkdir blog

方法2：直接手动创建一个blog文件

进入blog目录中：cd blog

5.初始化一个博客：hexo init

6.启动博客：hexo s 就是hexo server ，写一篇博客，可以用hexo s这个命令启动预览下

7.网页地址栏输入：localhost:4000

输入：hexo n "我的第一篇博客文章"

配置config，如果下载了vim，可直接用vim编辑器：vim 我的第一篇博客文章.md

也可以直接用vscode、notepad++、记事本等编辑。

输入cd../..退回到blog目录下，接着输入以下命令：

清理下：hexo clean

生成下：hexo g

启动下：hexo s

刷新下：http://localhost:4000

以上 Hexo 博客的搭建已经完成了。

三、部署到GitHub

1.登录自己的 Github

2.新建一个仓库：

注意：一定是你的昵称.github.io

例如我的 Github 昵称是Good-omen，那么这里输入Good-omen.github.io

继续在 blog 目录下，输入命令行操作：

3.装 Git 部署的插件：cnpm install --save hexo-deployer-git

里面的红色警告可以忽略不管。

去 blog 文件下，直接看到一个_config.yml，修改_config.yml即可。注意：blog文件夹下的其它文件下也有_config.yml文件，别改错了文件。

改完后记得保存！

4.最后部署到远端：hexo d

刷新GitHub，会发现很多文件，可以直接访问https://Good-omen.github.io,并看到博客已经部署到GitHub上去了。

四、更换博客主题

1.Hexo主题地址：https://hexo.io/themes/

换个自己喜欢的主题，克隆到 themes 主题上去：

git clone https://github.com/volantis-x/hexo-theme-volantis.git themes/volantis

git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia

themes 文件夹下会出现下载的主题

2.现在把主题配置到博客上去：

修改_config.yml文件：

theme: yilia
theme: volantis
用哪个主题就换哪个主题的名字，注意名称前面有个英文空格。

3.输入以下命令：

hexo clean
hexo g
hexo s

4.启动本地服务：http://localhost:4000

、