个人博客hexo+github搭建
前言
学习目的
1)搭建个人博客
学习路线(怎么学)
1) windows10系统
2)看哔哩哔哩视频
3)百度
资料定位
1)学习笔记
一 准备工作
1.1 准备nodejs
官方上下载Windows (x64)长期支持版 Long Term Support (LTS) schedule
,但是慢的飞起,在这里下载几秒钟结束战斗:http://nodejs.cn/download/
下载完成后,傻瓜式下一步一直到结束。什么也不用改。安装完成后,打开windows的命令行窗口cmd,输入node -v
查看是否成功,输入npm -v
查看npm工具安装是否成功:
C:\Users\AYZP>node -v
v12.16.2
C:\Users\AYZP>npm -v
6.14.4
nodejs自带npm包管理工具,可在cmd中查看npm版本。但是这个东东下载东西太慢,弃之不用,利用npm安装cnpm。在cmd命令行输入:
npm install -g cnpm --registry=https://registry.npm.taobao.org
在cmd输入cnpm -v
查看是否安装成功
cnpm -v
1.2 安装hexo
在windows命令行窗口cmd,输入cnpm install -g hexo-cli
安装hexo
cnpm install -g hexo-cli
安装完成后,输入hexo -v
查看安装是否成功
hexo -v
1.3 准备git
准备下载git,当然官网依然慢的飞起,到这里下载https://npm.taobao.org/mirrors/git-for-windows/
git也是傻瓜式下一步安装完成。
在安装完成后,在桌面,邮件出现如下图片,证明成功:
git安装二 利用hexo搭建个人博客
不要怕出错,错了就把mygitblogs文件夹删掉,重新来就可以了。碰到问题用百度。
2.1 在D盘建一个空的文件夹MyHexoBlogs
2.2 进入文件夹MyHexoBlogs,右键点击Git Bash Here
git2.3 建立mygitblogs项目,并对其进行初始化
hexo init mygitblogs
cd myblogs
cnpm install
这样会在MyHexoBlogs文件加下创建mygitblogs文件夹,并在内部生成相应的项目文件:
2.4 在本地启动个人博客
- 按下
hexo s
就可以启动hexo个人博客
hexo s
- 在浏览器输入
localhost:4000
进行访问。不想显示了就按下键盘crtl+c
结束访问。
2.5 在个人博客上添加文章
- 文章都放在
D:\MyHexoBlogs\mygitblogs\source\_posts
中,我们要发布文章时,可以直接把文章复制在这里。在初始化的时候有一篇文章。
- 建立文章:在
git Bash
中输入命令hexo n "文件名"
建立文章,下面建立一篇文章我的第一篇博客.md
。
hexo n "我的第一篇博客.md"
然后在文章里随便写点什么文字。
- 刷新hexo博客页面:在
git bash
中输入命令hexo g
刷新文章。
hexo g
你再按下hexo s
启动个人博客,再在浏览器输入localhost:4000
查看发现,个人博客页面更新了。
- 删除文章:在文件夹
D:\MyHexoBlogs\mygitblogs\source\_posts
里删除你不想要的那篇文章,然后输入hexo clean
和hexo g
进行更新。
hexo clean
hexo g
然后你重新hexo s
启动个人博客,在浏览器访问localhost:4000
发现,文章消失了。
- 但这只是本地,你可以用来预览,想要在网页查看,就需要远端部署,我们这里部署在github上。
2.6 在github上部署个人博客
- 在github上创建一个新的库,然后库命名为
你的名字.github.io
,后缀必须要命名为.github.io
。复制仓库的HTTPS的地址。 - 安装一个部署插件:在
git bash
输入命令cnpm install --save hexo-deployer-git
cnpm install --save hexo-deployer-git
- 设置文件
_config.yml
,其路径为D:\MyHexoBlogs\mygitblogs\_config.yml
。打开这个文件,拖到最后。修改deploy:
deploy:
type: git
repo: 你的github仓库的HTTPS地址
branch: master
- 部署:在
git bash
输入命令hexo d
。在这过程中,需要输入github的账号和密码。刷新下你的github你会发现,多了一些东西,那就是我们的博客。
hexo d
- 再取
你的名字.github.io
直接输入到浏览器的搜索栏中即可进入。这样以后你就不用再通过localhost:4000
在本地访问,直接通过https://你的仓库名字.github.io即可访问。
三 发文章、删文章基本操作
3.1 发文章(带图片)
- 设置文件
_config.yml
中的post_asset_folder: true
- 安装hexo-asset-image
在git bash
执行
cnpm install https://github.com/CodeFalling/hexo-asset-image --save
- 使用
完成安装后用hexo新建文章会发现完成安装后用hexo新建文章的时候会发现_posts目录下面会多出一个和文章名字一样的文件夹。图片就可以放在文件夹下面。
在md文章中引用图片时使用:
![](本地图片测试/logo.jpg)
【注】:如果使用Typora编辑文件,如下设置偏好设置,在插入图片时,会自动将文件保存在一个同名.assets的文件夹中,到时,只需将.assets文件夹中的图片复制到_posts目录下的文章同名文件夹中即可。
3.2 删文章
- 删除_posts下的你不想要的文章(文件路径D:\MyHexoBlogs\mygitblogs\source_posts)。
- 在
git bash
输入以下指令完成更新
hexo clean
hexo g
- 完成部署
hexo d
参考文献
[1] 超级吴小迪. 在官网下载nodejs和git速度慢的解决方案. CSDN博客.2019. https://blog.csdn.net/weixin_43606158/article/details/100609856
[2] CodeSheep. 手把手教你从0开始搭建自己的个人博客 |无坑版视频教程| hexo. bilibili. 2019. https://www.bilibili.com/video/BV1Yb411a7ty
[3] 武安长空. hexo博客图片问题. 简书. 2017. https://www.jianshu.com/p/950f8f13a36c