一个晚上的时间在GitHub上白P个人博客

从收集资料到开始搭建到本文基本成型用了四个小时左右

并不会很费劲,在满足下述条件的情况下搭建用了一个多小时左右做完(🥦🐔)
一个小时白P一个自己的博客啊兄弟萌!

放个效果图和链接,虽然一切都还很简陋~
效果

条件

拥有一个GitHub账号:挂一个百度经验
安装Git:挂一个官方教程
node.js:挂一个菜鸟教程的链接

第一步:安装Hexo

挂一个官方教程

  1. 在你想要存储的位置创建一个文件夹。例如这里选择Z盘的Blog文件夹存储(可以随便取名字,因为这是存储Hexo的文件夹,之后还要创建项目文件夹)
    Hexo存储位置
  2. 进入文件夹点击右键,选择Git Bash Here
    git-bash样式
  3. 依次输入以下命令(npm会在安装node.js的时候已经自动安装)

npm install hexo-cli -g
下载安装模块到【全局目录】中
下载截图
npm install hexo --save
将模块安装到项目目录下,并在package文件的dependencies节点写入依赖。
安装截图

验证安装
hexo -v

验证Hexo安装

这个时候Hexo就安装好了

第二步:初始化项目

1.在当前目录新建项目,命令为hexo init 项目名称

hexo init Blog
初始化本地文件夹为网站的根目录,会自动新建文件夹
初始化成功
2.生成静态文件,命令为hexo generate 或者简写为
hexo g
生成过程
3.启动本地服务器,命令为hexo server或简写为
hexo s
运行项目
4.成功后可以通过http://localhost:4000/访问项目
成果展示
至此你已经在本地完成了hexo的安装应用,接下来就是它发布到GitHub上

第三步:创建GitHub项目并配置SSH

1.创建新项目,项目标题严格按照下方格式命名,我也不知道为什么但是官方文档有明确指出
你的帐户名.github.io
GitHub创建项目界面
2.添加配置
git config --global user.name “yourname”
git config --global user.email “youremail”
输入用户名和邮箱
3.生成密钥
ssh-keygen -t rsa -C “youremail”
生成密钥
4. 复制id_rsa.pub文件的所有内容
复制该文件内容
5. 点击GitHub页面右上角你的头像,在下拉框点击setting,之后点击ssh and gpg keys,最后点击右上方的新建SSH
tite可以随意取,key填写id_rsa.pub里的内容
新建SSH
6. 测试连接
ssh git@github.com
测试连接

第四步:发布到GitHub

1.在项目文件夹里的_config.yml文件最后找到并修改deploy为你的GitHub项目地址
配置deploy
2.安装部署插件
npm insatll hexo-deployer-git – save
安装插件
3. 部署网站,命令为hexo deploy或简写为
hexo d
在弹出的窗口输入账号密码
登录
4. 最后显示这样就是成功了,可以通过yourname.github.io访问到和本地一样的页面了
成功

第五步:换一套好看的皮肤

1.在你的项目文件夹下创建用于存储的文件夹,next是我想要更换的主题项目名称,用其他的就换其他的
mkdir themes/next
创建文件夹

2.拉取next主题(还有很多可以自已百度下安装方法),格式为git clone 网址 目标文件夹
git clone https://github.com/theme-next/hexo-theme-next theme/next
拉取next
3. 修改next目录下的_config.yml文件,这里是修改语言为中文
修改语言
4. 修改主题,四个主题样式可在官方网站预览,只能选择一个
四选一
5. 发布到git中
hexo clean && hexo g && hexo d
命令
成功提示
6. 效果预览
效果

参考文章

CSDN用户Theigrams的Github+Hexo搭载博客
CSDN用户Moooooove的Hexo博客主题安装及Next主题个性化修改
博客园用户李建明180的Hexo+Git一个小时快速搭建个人博客
知乎用户bestvist的hexo + github 博客搭建
思否用户Eirunye的Hexo搭建GitHub博客

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值