一.安装node.js (Node.js是Hexo插件运行的基础)

node.js的下载地址:https://nodejs.org/zh-cn/download/releases/

步骤:

  1. 选择适合电脑的相应的安装包 (选择后缀名是.msi的安装包)
  2. 下载完成之后直接安装,一直点“Next”即可
  3. 安装完整后,打开cmd命令
    (1)node -v 显示node.js的版本说明安装成功
    (2)npm -v 显示npm版本说明自带的npm安装成功

安装完的目录如下:

注意:

新版的Node.js已自带npm,安装Node.js时会一起安装,npm的作用就是对Node.js依赖的包进行管理,也可以理解为用来安装/卸载Node.js需要装的东西

二.安装git

通过git把Hexo生成的网页提交到Github pages上

  1. git的下载地址 : https://git-scm.com/download/win
  2. 下载完成之后直接安装,一直点“Next”即可
  3. 安装完整后,打开cmd命令,输入git version检查Git版本

三.安装Hexo

1.在电脑常里创建一个文件夹,可以命名为Blog

2.点击进入创建的文件夹,点击鼠标右键选择“Git Bash Here”

(1)安装Hexo (hexo默认会被安装到C盘)

输入以下命令:

npm install hexo -g 

(2)检查是否安装成功

输入以下命令:

hexo -v 

(3) 初始化该文件夹

输入以下命令:

hexo init

初始化完成之后打开所在的文件夹可以看到以下文件:

  • node_modules:是依赖包
  • public:存放的是生成的页面
  • scaffolds:命令生成文章等的模板
  • source:用命令创建的各种文章
  • themes:主题
  • _config.yml:整个博客的配置
  • db.json:source解析所得到的
  • package.json:项目所需模块项目的配置信息

(4) 安装需要的组件

输入以下命令:

npm install

(5) 生成静态文件

输入以下命令:

hexo g

(6) 启动服务器

输入以下命令:

hexo s

注意:

此时遇到一个情况,虽然hexo正常启动了,但是浏览器无法访问http://localhost:4000/,因为4000端口被占用了,输入hexo s -p 5000,然后访问http://localhost:5000/ 

四.gitHub创建个人仓库

github的地址:https://github.com/

github创建个人仓库的步骤:

1.注册账号成功之后,点击右上角+号,选择New repository

2.进入一个页面,该页面的Repository name填写的格式必须是:用户名.github.io

3.必须勾选publicAdd a README file

4.最后点击create repositorie按钮

五.生成SSH添加到gitHub

点击进入之前创建的博客文件夹里面,选择Git Bash Here

1.依次输入以下命令:

git config --global user.name "你的GitHub用户名"
git config --global user.email "你的GitHub注册邮箱"
cd ~/.ssh
ls

注意:

第3个命令cd ~/.ssh和第4个命令ls就是检查是否已经存在 id_rsa.pub 或 id_dsa.pub 文件,如果文件已经存在,那么就跳过步骤2,直接进入步骤3

2.输入命令

ssh-keygen -t rsa -C "你的GitHub注册邮箱" 

接着回车三下

最后得到了两个文件:id_rsa和id_rsa.pub,默认存储路径是:C:\Users\Administrator\ssh

3.在目录C:\Users\Administrator\ssh找到id_rsa.pub文件,这个文件存储的是密钥

4.登录Github,点击 用户头像→Settings→SSH and GPG keys→New SSH key→将文件id_rsa.pub里面的内容复制到Key文本框中, title随便取,然后点击 Add SSH key 按钮

5.在电脑桌面右击,选择Git Bash Here,在git bash窗口中输入以下命令,验证是否添加成功

ssh -T git@github.com

六.将hexo部署到gitHub

1.找到之前建的博客文件根目录,例如我的是在E:\Blog,找到_config.yml配置文件
2.打开_config.yml配置文件,翻到配置文件的最下方,修改为:

deploy:
    type: git
    repo: git@github.com:HeMiaomiao/HeMiaomiao.github.io.git
    branch: main

注意:

  1. 现在分支不能写成master,因为github现在把默认分支从master改为了main
  2. 冒号后面有一个半角空格,并且type,repository,branch的首字母要对齐

3.点击进入之前创建的博客文件夹里面,右击选择Git Bash Here,依次输入以下命令:

npm install hexo-deployer-git --save
hexo clean 
hexo g
hexo d  

注意:

输入hexo d之后要输入gitHub账户的用户名和密码,命令行出现INFO Deploy done:git就表明发布成功

4.打开网页,输入http://GitHub账户的用户名.github.io,就可以看到个人博客啦!

七.更换Hexo主题

1.地址:https://github.com/search?q=hexo-theme,找到自己喜欢的主题,点击进去查看文档里面的详细介绍,找到这样下载链接:

例如主题pacman:

主题next:

2.点击进入之前创建的博客文件夹里面,例如我的是在E:\Blog,右击选择Git Bash Here,在窗口中输入上面找到的下载链接,例如下载主题pacman,就在窗口中输入git clone https://github.com/A-limon/pacman.git themes/pacman

3.点击进入之前创建的博客文件夹里面,找到配置文件_config.yml,把配置文件_config.yml里面的theme修改为现在选择的主题,格式为:theme: 主题名字,例如,theme:pacman

4.点击进入之前创建的博客文件夹里面,例如我的是在E:\Blog,右击选择Git Bash Here,在窗口中依次输入以下命令:

hexo clean
hexo g
hexo s
hexo d

注意:

跟现在新选择的主题相关的配置在themes/主题名字/_config.yml里面,然后根据你的需要在这修改就行了

github + hexo搭建博客的教程1

github + hexo搭建博客的教程2

github + hexo搭建博客的教程3


坚持