手把手教你搭建个人博客:hexo+github

环境准备

  1. 安装node.js环境(hexo博客框架基于node.js)
  2. 安装git客户端

操作步骤

  1. 回到电脑桌面,点击鼠标右键,选择“Git Bash Here”
    在这里插入图片描述
  2. 输入命令行,
npm install -g hexo
  1. 在自己的E盘新建文件夹(不建议在C盘),名字为hexo。进入hexo文件夹,点击鼠标右键,选择“Git Bash Here”,输入指令
hexo init 
  1. 等待安装完成之后,继续在原界面输入命令
npm install
  1. 回到hexo文件夹,点击鼠标右键,选择“Git Bash Here”,依次输入命令
hexo g
hexo s
  1. 完成之后,在浏览器输入网址:http://localhost:4000/,此时你自己已经能够访问到这个网址了。但是被人是访问不到的。

创建Github账号,创建仓库

  1. 前往Github,创建一个repository(仓库),命名格式硬性规定:你自己的Github账号名字+github.io
    在这里插入图片描述

部署文件到GitHub

  1. 打开 hexo 文件夹下的 _config.yml 文件,找到关键字 deploy (在最底下),然后修改成如下。repository的网址就是你刚创建的仓库网址,直接copy即可。(type冒号与git之间需要有一个空格)
deploy:
  type: git
  repository: https://github.com/LiangYurong/LiangYurong.github.io
  branch: master
  1. 进入hexo文件夹,点击鼠标右键,选择“Git Bash Here”,输入指令
git config --global user.name "你的用户名"
git config --global user.email "你的邮箱"

配置SSH

  1. 找到路径C:\Users\Administrator.ssh,如果已经存在SSH Keys ,直接删除.ssh 文件夹下的所有的文件,如下图。(第一次搭建博客是不存在.ssh文件夹的,所以这一步省略了)

  2. 打开之前建立的hexo文件夹,点击鼠标右键,选择“Git Bash Here”,输入以下指令(xxx@qq.com指的是你注册github的邮箱),连续回车,回车三次

ssh-keygen -t rsa -C "xxx@qq.com"
  1. 进入hexo文件夹,点击鼠标右键,选择“Git Bash Here”,依次输入指令
ssh-agent -s

ssh-add ~/.ssh/id_rsa
  1. 如果在输入ssh-add ~/.ssh/id_rsa出现错误,如下图
    在这里插入图片描述
  2. 依次输入以下指令来解决错误(没出现错误不需要执行以下指令)
eval `ssh-agent -s`

ssh-add
  1. 拷贝key,执行以下指令
clip < ~/.ssh/id_rsa.pub
  1. 打开Github,点击setting,然后再点击SSH and GPG keys,如下图

在这里插入图片描述
在这里插入图片描述
8. 点击 New SSH key,title可以随便自定义名字,key栏目直接ctrl+v粘贴即可。
(如果这一步你不能进行粘贴,那么请重复 配置SSH的步骤
在这里插入图片描述
9. 输入以下代码,然后会让你输入yes/no,你输入yes即可。以上ssh就配好了,我们就可以将项目部署到github上。

ssh -T git@github.com
  1. 部署截图
    在这里插入图片描述
  2. 依次执行以下指令,
hexo g
hexo d
  1. 如果执行hexo d 出现以下错误。则输入指令 npm install hexo-deployer-git --save
    在这里插入图片描述

  2. 安装好以后输入 hexo d ,会有弹出框,输入github账号密码即可,就可以访问了。浏览器输入 https://liangyurong.github.io/ 即可访问hexo 默认界面。
    在这里插入图片描述

  3. 博客网站就这么搭建完成啦!!!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值