github+hexo个人博客搭建

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/lxfHaHaHa/article/details/85964001

闲来无事搭个博客,步骤如下:

1. git安装

下载git并安装,可以用我上传到csdn的地址,也可以到官网下载,这里要注意,安装过程中有这一步选第三个,添加到环境变量,其余都下一步:
在这里插入图片描述

2. nodejs安装

下载nodejs并安装,可以用我上传到csdn的地址,也可以到官网下载,这里要注意,安装过程中注意是否添加环境变量,添加到环境变量,其余都下一步:
在这里插入图片描述

3. 用npm安装hexo

接下来安装hexo,可以选择新建一个文件夹在上面局部安装,也可以选择全局安装,不过全局安装需要管理员权限,我这里用的是全局安装。

3.1 打开powershell,管理员模式

在这里插入图片描述

3.2 查看npm镜像
npm get registry

在这里插入图片描述
这里的https://registry.npmjs.org/是官方镜像,下载速度很慢,我们切换成淘宝镜像:

 npm config set registry http://registry.npm.taobao.org/

(如果想换回原镜像的,如下:npm config set registry https://registry.npmjs.org/

3.3全局安装hexo
 npm install -g hexo

在这里插入图片描述

4. hexo生成博客

4.1 新建hexo仓库

选择一个空的目录,右键git bash here在这里打开git bash ,然后输入 hexo init 命令生成一个hexo仓库:
在这里插入图片描述

4.2 生成文件的说明
文件/文件夹 说明
node_modules hexo所需要的node依赖包
public 存放的是生成的页面
scaffolds 命令生成文章等的模板
source 用命令创建的各种文章
themes 博客主题
_config.yml 整个博客的配置
db.json source解析所得到的
package.json 项目所需模块项目的配置信息
4.3 安装依赖

输入npm install 安装所需要的组件:
在这里插入图片描述

4.4 本地运行体验
hexo g
hexo s

在这里插入图片描述
这里的http://localhost:4000 就是地址,浏览器打开访问即可看到效果哦:
在这里插入图片描述
这就是我们的博客了~

5. 与github相关联

5.1 git本地设置

打开git bash,输入以下代码进行配置(如果以前没有配置过的话):

 git config --global user.email "你的邮箱"  回车

 git config --global user.name "你的用户名"  回车

然后可以输入 git config --list 来查看配置信息:
在这里插入图片描述

5.2 生成密钥

ssh-keygen 指令生成密钥

ssh-keygen -t rsa -b 4096 -C "你的邮箱@.com"

在这里插入图片描述

看下生成的文件:
在这里插入图片描述
这里的id_rsa 是私钥,自己保存好;id_rsa.pub 是公钥,用来存放在其他服务器上的;

5.3 将公钥复制到github上

复制公钥:

cat ~/.ssh/id_rsa.pub

在这里插入图片描述

到github的设置界面:
在这里插入图片描述

新增SSH KEY:
在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

5.4 github新建仓库

新建仓库,这里要注意仓库名字要写成用户名.github.io,且要公开 ,并勾选readme:
在这里插入图片描述

5.4 GitHub Pages

然后去项目的setting,向下找到GitHub Pages:
在这里插入图片描述

记住这个网址,这就将是我们博客的地址:
在这里插入图片描述

6.配置hexo发布到网络

6.1 修改_config.yml

先复制仓库的地址,要注意这里是“git@gihub”开头的地址:
在这里插入图片描述

然后,配置Deployment,在其文件夹中,找到文件,修改deploy属性:

deploy:
  type: git
  repository: 仓库的ssh地址 
  branch: master

在这里插入图片描述

6.2 安装git扩展

在hexo仓库的文件夹下,右键git bash here,安装扩展:

npm install hexo-deployer-git --save

在这里插入图片描述

6.3 新建一篇博客
hexo new post '博客的名字'

在这里插入图片描述

就在source/_posts 下面生成了一个md文件,我们修改里面的内容,就是我们的博客内容:
在这里插入图片描述

6.4 生成以及部署
hexo d -g

在这里插入图片描述
在这里插入图片描述

6.5 访问博客

大功告成,访问刚刚记住的博客网址:https://whoknowsss.github.io/
在这里插入图片描述

7.后记

有个自己的博客系统,感觉还是挺棒的,后期文章将讲解如何配置主题巴拉巴拉的

猜你喜欢

转载自blog.csdn.net/lxfHaHaHa/article/details/85964001