Hexo+GitHub十分钟搭建个人博客站点

一个合格的Java程序员都应该拥有一个博客站点,最起码的作用:
① 技术笔记
② 经验总结
③ 前后端可劲造 - 学习
④ 美文撰写

搭建博客的系统环境:Windows 10 企业版 LTSC
只要是 Windows 主流系统环境下,本质上步骤并不会有任何差异。

1. GitHub 准备工作

1.1 GitHub 账号注册

在这里插入图片描述

1.2 GitBash 下载安装

下载地址:https://gitforwindows.org/
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
剩下的,一路默认就行(安装路径根据自己需要更改)。

1.3 Node.js 下载安装

下载地址:https://nodejs.org/zh-cn/
在这里插入图片描述
一路默认就行(安装路径根据自己需要更改)。

2. Hexo 准备工作

2.1 Hexo 下载安装

① 在任意位置点击鼠标右键,选择Git Bash
在这里插入图片描述
② 安装Hexo命令:npm install -g hexo
在这里插入图片描述

2.2 Hexo 初始化配置

  1. 创建文件夹(我的是在D盘创建的Hexo)
    在这里插入图片描述
  2. 在Hexo文件下,右键运行Git Bash,输入命令:hexo init
    在这里插入图片描述
  3. _config.yml,进行基础配置
    在这里插入图片描述
    在这里插入图片描述
    4、主题选择(博客整体外观哦)
    Hexo的主题分享页:https://hexo.io/themes/
    该页面里点击图片是预览,点击主题的名字则是进入git中,获取其git主题路径,然后在Hexo文件夹下使用 Git Bash。
    输入命令(注意空格):git clone 主题的git链接 themes/目录名
    eg: git clone https://github.com/wujun234/hexo-theme-tree.git themes/tree
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述

3. 博客更新、预览、部署(外网访问)

3.1 文章更新

磁盘:\Hexo\source\_posts文件下,新建.md文件就可以以 markdown 格式写文章。
.md格式,即 markdown 格式的文本,熟练3-5个便捷的 markdown 命令,文章的效率和美观度嗖嗖的上涨。信我!试试!
(本篇20分钟编辑完,带图,你信吗?)

最佳搭档:markdown语法 + Typora工具

在这里插入图片描述

3.2 博客本地浏览方式

① Git Bash 输入命令:hexo g && hexo s
在这里插入图片描述
② 在浏览器输入:http://localhost:4000 ,就可以进行访问
在这里插入图片描述

3.2 博客部署到 GitHub 上

① 登陆 github 账号,new repository创建仓库、获取同名的https 仓库源地址
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

② 在 _config.yml 进行配置:
在这里插入图片描述
③ 安装 hexo-deployer-git 自动部署发布工具:
安装命令(注意路径):npm install hexo-deployer-git --save
在这里插入图片描述
④ 一键发布到 GitHub:
发布命令(注意路径):hexo clean && hexo g && hexo d
第一次发布会需要填入 github 账号密码,正确填入即可。
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
⑤ 测试访问:
在浏览器输入:https://janycode.github.io/

3.4 更新 + Git部署

常规日常更新操作四步走:
① 文章更新到固定路径下
磁盘:\Hexo\source\_posts\文章名称.md
② 进入 Hexo 目录
cd D:\Hexo
③ 本地部署,并浏览查看,确认无误
hexo g && hexo s
④ 远程部署,push到git仓库,即可浏览 xxx.github.io 正式博客确认是否更新。
hexo clean && hexo g && hexo d
完美!
所有涉及到的命令统一使用右键里的 Git Bash,规避各种神坑,你懂的。
在这里插入图片描述

4. 遇到的问题 & 解决方案

4.1 _config.yml 中文乱码问题

_config.yml 配置(我只改了这一部分,用记事本修改好像会出问题。
在 localhost:4000 上运行,标题和副标题都出现乱码。
在这里插入图片描述
为什么设置了zh-CN还会乱码呢?
解决方案:
1.不要用记事本打开,因为记事本不会utf8转码,用sublime text编辑
2.或者用记事本打开另保存为utf-8编码

4.2 Push到git仓库时报错 fatal: HttpRequestException encountered

无论是push前先将远程仓库pull到本地仓库,还是强制push都会弹出这个问题。
网上查了一下发现是Github 禁用了TLS v1.0 and v1.1,必须更新Windows的git凭证管理器,才行。
https://github.com/Microsoft/Git-Credential-Manager-for-Windows/releases/tag/v1.14.0
点击下载安装 GCMW-1.14.0.exe ,测试远程push还是不行,灵机一动,万能的重启电脑,问题就解决了。ORZ…
此处切记一点,更新到远程git仓库时使用 Git Bash 的命令行操作
在这里插入图片描述

4.3 每次部署到远程 github 总是需要输入账号密码

在这里插入图片描述
解决方案:
配置SSH key
① 在任意文件夹下,右键git bash,配置生成公钥:

$ cd ~/.ssh
$ git config --global user.name "yourname"
$ git config --global user.email "youremail"
$ ssh-keygen -t rsa -C "youremail"(后三个空格即可,也可以根据提示输入)

2、这时候.ssh下将出现两个文件id_rsa和id_rsa.pub,id_rsa.pub是公钥,打开复制里面的内容
3、在github中的 yourname.github.io 仓库下的 setting 下的 deploy ssh 下添加 key,将上述内容复制即可,title任意;
4、测试

$ ssh -T [email protected]

输入 yes,出现如下信息则正常:
Hi username! You’ve successfully authenticated, but GitHub does not provide shell access.
后续再使用 远程部署 命令则会自动登录,无需输入账号密码。

发布了327 篇原创文章 · 获赞 312 · 访问量 67万+

猜你喜欢

转载自blog.csdn.net/sinat_36184075/article/details/105660493