0%

hexo框架下部署个人博客

记录一下第一次使用hexo框架的摸索过程

啰嗦两句

  参考了很多篇博客,花了一天时间终于把不那么完整的博客上线了,对于我这个HTML小白来说还是挺有成就感的哈哈,简单记录一下。
  Hexo是一个快速、简介的博客框架,用户可以将Markdown格式文件上传并生成网页。以下是我进行部署时的步骤与一些要点:

Step1:安装Git与node.js

1.1 安装Git   官网:https://git-scm.com/

1.2 安装node   官网:https://nodejs.org/en/

1.3 在系统环境变量中添加node的路径,以确保你的电脑能访问到他
(系统环境变量:右击此电脑-属性-高级系统设置-环境变量)

1.4 打开gitbash命令界面,输入以下命令检验是否安装成功:
node -v
npm -v

Step2:安装hexo

2.1 更换国内镜像源:防止下载速度过慢
npm config set registry https://registry.npm.taobao.org

2.2 确认更换状态:
npm config get registry

2.3 进入node安装目录,创建文件夹node_globalnode_cache 并执行以下命令

npm config set prefix "D:\programming\nodejs\node_global"
npm config set cache "D:\programming\nodejs\node_cache"

2.4 环境配置:新增环境变量NODE_PATH和添加Path(用户变量和系统变量),两个值都为 \node_global文件夹位置。

2.5 安装hexo!
在你想要安装hexo的地方(我在node里)右键:gitbash here
npm install hexo-cli -g
可以再装个:
npm install hexo -save

Step3:新建博客文件夹

3.1 新建一个blog文件夹

3.2 gitbash here,输入hexo init,初始化hexo环境

3.3 输入npm install,安装npm依赖包

3.4 输入hexo generate或者是hexo g,生成静态页面,输入hexo server或者是hexo s,打开静态页面链接查看生成的hexo博客

3.5 ctrl+C关闭

Step4:连接至GitHub

   在之前的步骤中,我们只是生成了一个本机才能访问的页面,接下来我们利用GitHub使所有人都可以访问你的网页

4.1 确保你拥有一个科学上网的途径以及一个GitHub账号

4.2 使本机和GitHub可以连接:

   4.2.1 检验本机是否产生过秘钥
     cd ~/.ssh
     ls

   4.2.2 如果没有,执行以下命令来生成密钥:
     ssh-keygen -t rsa -C "自己的邮箱地址"

   4.2.3 按三次回车,生成成功后,去对应默认路径里用记事本打开id_rsa.pub,得到ssh key公钥。

   4.2.4 在个人GitHub账号里,找到setting->SSH and GPG keys->new SSH key,输入title,将id_rsa.pub中的内容粘贴到下面key中,点击下面的add SSH key。

   4.2.5 新建一个GitHub仓库,命名为username.github.io

Step5:设置博客文件夹

5.1 在之前新建的博客文件夹(我之前提到的blog文件夹)中,打开配置文件_config.yml,按照以下方式更改:

5.2 在Git Bash中执行npm install hexo-deployer-git --save命令

5.3 最后执行 hexo deploy或者hexo d,完成部署

Step6:发布文章

6.1 Git Bash中输入hexo new title,title是文章的名字。完成后可以看到在\Blog\hexo\source_posts\ 文件夹中新建了一个markdown文件

6.2 编辑文件,执行hexo ghexo d 即可发布

6.3 访问username.github.io查看博客

后记

当然,以上是最简单的博客部署方式,你可以下载不同的主题(theme)并更改配置文件以更改主题,获得更好的视觉效果

注意,更改配置文件后,出现无法提交的问题,一个原因是改错了,一个原因是网速,此时重新部署,或先执行hexo clean,再g、d。