LOADING

正在加载

Github部署hexo博客

2023/11/29 乱七八糟 hexo

壹 前言

使用GIthub+hexo搭建博客,成功后的效果:https://a7cc.github.io

贰 准备工作

2.1 安装必要工具

  • 需要安装两个软件:node.jsGit
  • 安装过程一直Next就可以了。如果想知道详细的安装教程,这里有两个教程:node.js教程以及Git教程

两者安装完成之后,右击此电脑->属性->高级系统设置->环境变量->系统变量下的Path。可以看到两者已自动修改了环境变量,这是我们可以通过cmd命令查看两者版本。(确认是否安装成功及可以使用)
查看Node.js版本命令:node -v
查看Git版本命令:git --version
该文章用的版本是:node-v16.15.0-x64Git-2.36.1-64-bit

2.2 注册Github账号以及建立仓库

Github的官网:https://github.com/
6fc76823ae516cbd6b7e2f8f316def52.png
ac224eeb420927ab2f467bcd582cdeb0.png
注册之后邮箱会收到一封Github的邮件,点击Github的链接确认注册。
6b89b120cf40a6fdde579a702f3da02f.png
之后就是建立Github个人仓库,新用户登陆后会自动跳转到创建页面,如果已有Github账号登陆进去可以在主页点击New
0d5a330ab7404b7417e7aa34c339ec2c.png
确认注册后会让用户选择公有还是私有仓库,由于私有的个人仓库需要钱,好像是每月7美金,所以我们在搭建个人博客时,直接选免费的就行了,需要注意仓库的取名格式:github的用户名.github.io,这将是以后的访问域名。
9e439b8a78cbd6de16c810c35ddb7e2d.png
到这里代表我们Github账号以及仓库都已经创建完毕,可以把下面这段仓库的地址复制下来留着后面配置时会用到。
99a5a1d12e7365a215c46a5d514412e5.png

叁 配置Hexo

3.1 创建Github本地仓库目录

创建一个用来存放Github本地仓库文件的目录,这里我们创建一个blog名字文件夹,进入该文件夹,右键点击Git Bash here,会打开Git命令窗口,也可以使用Windows的cmd命令行,不推荐:
aebc8f5c04e8f07a286e9a55eaf02950.png
ef22ac507a6de5926a637245cf3eed33.png
因为是从国外服务器下载,受网络的影响比较大,有可能会出现异常,所以我们需要连接国内淘宝官方的服务器来进行,输入命令:npm config set registry https://registry.npm.taobao.org
b2073caf4db50d82263c4a0c6d773987.png
验证命令:npm config get registry,返回https://registry.npm.taobao.org,说明镜像配置成功。

3.2 安装Hexo

使用npm install -g hexo命令初始化hexo主题,-g是全局设置:
57df70ea18fc74c3ed43a384cd82d4f4.png
使用hexo -v来查看hexo是否安装成功,成功就会返回hexo的相关信息:
a813db7260a74848f81ed3b5b8978dd0.png

3.3 初始化Hexo

使用hexo init初始化Hexo,需要等好一会,最后会出现Start blogging with Hexo!字样,并且在创建的文件夹里多出许多文件,说明初始化成功:
2f3fcfb6592fa1a1475eb4c8f765e80d.png
初始化后就可以改主题了!改主题的话Hexo博客的优化这篇文章会讲!

3.4 本地运行Hexo

初始化hexo之后使用命令hexo s启动本地服务器,在浏览器输入localhost:4000就可以在本地浏览博客,自带一篇Hello World博客,关闭hexo本地服务是ctrl + c命令:
efdd89071c5f69460896bfdc9f309280.png

肆 设置ssh

4.1 生成sshkey

首先生成sshkey,输入命令cd ~/.ssh,进入.ssh文件,输入命令ssh-keygen -t rsa -C '注册时的邮箱地址'需要注意C:\Users\用户名\下存在.ssh文件夹,一路回车即可,不需要输入其他内容,生成成功后,发现C:\Users\用户名\.ssh\文件夹下多出两个文件:
92f96352302f13b4739c534b68ba7bbe.png
08f53e74e916b9e251c5363477f6f3fc.png
接着在已登陆的Github主页点击右侧头像-> Settings设置:
dbff610b822ebfef61e04062df502181.png
再点击SSH and GPG keys -> New SSH key
1e1a10eef18cdf1c6b09452efd97db30.png
使用cat id_rsa.pub,复制显示出来的文本:
4ae9afb51df397fd9934f5e91dc81e29.png
将刚刚在.ssh目录下所复制id_rsa.pub文件中的信息复制进key(注意空格),标题名字随意:
47209e3ba73de11fadbb994d60877c27.png
这里需要在本地进行验证一次密钥是否设置成功,输入命令ssh -T git@github.com,输入yes之后,行末尾会显示你的用户名,说明设置成功:
4baffb6abb15563375b865a41adbf600.png

4.2 绑定Github的用户名和邮箱

接着在本地绑定与Github的用户名和邮箱,输入命令git config --global user.name"注册时用户名"设置Github的用户名,输入命令git config --global user.email"注册时邮箱"设置Github的邮箱:
e6c10b298582ad8f23e0c9243e67ac61.png

伍 上传测试博客

5.1 修改设置并下载插件

用记事本打开并修改本地仓库目录下_config.yml文件,翻到最后的deploy: 修改为下图形式,并进行保存:
07e9880863181a3f20516ed603c49139.png

deploy:
  type: git
  repository: https://github.com/用户名/用户名.github.io.git
  branch: master

_config.yml找到url修改为自己的博客链接:
5b51e93722202efaa1f39ac04f75efe7.png
在git终端输入npm install hexo-deployer-git --save来安装git插件:
e9c1cb23031d85678ff1562e4a392058.png

5.2 生成令牌

接着在已登陆的Github主页点击右侧头像-> Settings设置:
dbff610b822ebfef61e04062df502181.png
点击Developer settings选项:
3dc6612428a85176b27b86181191488a.png
生成令牌:
610c5ffc98278cee349e2e201a7c689f.png
设置令牌信息,并创建:
636d41d7a5bc8104db8767375c1f0277.png
这是生成的令牌,点击按钮进行复制,后面会用到:
ecb1031545e997f525b0656b67278deb.png

5.3 部署

最后将Hexo部署到GitHub上,输入hexo d -g,之后需要输入注册的用户名和令牌,使用网址:https://你的用户名.github.io 访问博客
629047d950ff961e9f26dd723161f774.png
adea1460c85234f716a10f6b37da31a2.png
出现这个界面说明成功部署:
e199b0026f500266142659cb9935a984.png
访问用户名.github.io,出现以下界面说明成功,因为用了diaspora主题导致出现这个页面,实际只要出现页面说明搭建成功:
78d990d3e97c98548843839186ac84f7.png

陆 一些命令

  • hexo init

hexo init 命令用于初始化本地文件夹为网站的根目录

hexo init [folder]
# folder可选参数,用以指定初始化目录的路径,若无指定则默认为当前目录
  • hexo clean

hexo clean 命令用于清理缓存文件

hexo clean
  • hexo generate

hexo generate 命令用于生成静态文件,一般可以简写为 hexo g

hexo generate
# -d选项,指定生成后部署,与hexo d -g等价
  • hexo deploy

hexo deploy 命令用于部署网站,一般可以简写为 hexo d

hexo deploy
# -g选项,指定生成后部署,与hexo g -d等价
  • hexo server

hexo server 命令用于启动本地服务器,一般可以简写为 hexo s

hexo server
# -p选项,指定服务器端口,默认为 4000
# -i选项,指定服务器 IP 地址,默认为 0.0.0.0
# -s选项,静态模式 ,仅提供 public 文件夹中的文件并禁用文件监视
# 运行服务器前需要安装 hexo-server 插件
npm install hexo-server --save
  • hexo new

hexo new命令用于新建文章,一般可以简写为 hexo n

hexo new [layout] <title>
# layout为可选参数,用以指定创建的类型post(文章)/page(文件夹)/draft(草稿),若无指定则默认由配置文件中的default_layout选项决定
# title为必填参数,用以指定文章/文件夹/草稿标题,如果参数值中含有空格,则需要使用双引号包围

其中<layout>scaffolds文件夹中,默认情况下有三个模板postdraftpage

参数 功能 路径
post 新建文章 /source/_posts/
draft 新建草稿 /source/_drafts/
page 新建页面(标签页,分类页等) /source/
  • hexo --safe

hexo --safe 表示安全模式,用于禁用加载插件和脚本

hexo --safe
  • hexo --debug

hexo --debug 表示调试模式,用于将消息详细记录到终端和 debug.log 文件

hexo --debug
  • hexo --silent

hexo --silent 表示静默模式,用于静默输出到终端

hexo --silent
  • 注意:
    • 在重新上传部署网站时,建议顺序执行hexo clean && hexo g && hexo d -g
    • 如果创建带有中文的路径名称时,生成静态页面hexo g可能会报错。解决方法是在git命令行输入git config --global core.autocrlf false即可

其他的一些配置可以参考hexo官网:跳转

柒 参考

avatar
小C&天天

修学储能 先博后渊


今日诗句