` Hexo+Github+Typora搭建自己的博客 | 听云轩

Hexo+Github+Typora搭建自己的博客

一、部署Hexo(后面操作基本在git bash里进行)
1、找个合适的位置,本地创建blog的家文件夹
2、进入到这个文件夹
AmnmL9.png
3、安装并且检查

1
2
npm install hexo-cli -g
hexo -v

4、初始化

1
hexo init

5、安装相应的组件

1
hexo install

6、生成本地静态文件

1
hexo g

7、启动本地web浏览

1
hexo s

注:通过本地的4000端口可查看,若一直无法加载,可查看本地4000端口是否被占用,若被占用,则映射到其他端口

1
hexo -s -p [端口]

此时,出现初始页面:
Amn6yQ.png

8、设置主题

    网上有很多hexo的主题,这里我用的是GitHub里iissnan的。

    在家目录文件夹下:

1
git clone https://github.com/iissnan/hexo-theme-next themes/next

此时我们查看当前的列表:
Am1oSx.png

    当前目录下的__config是你的站点的相关配置信息, theme文件夹,里面的next文件夹里也有一个__config.yml,这个是你的主题相关设置文件。

    克隆完成后,编辑当前目录下的__config.yml文件,找到theme字段,并将其值改为next。

9、更新配置

  • 清除原先缓存
1
hexo clean
  • 进行本地部署并查看
1
hexo g && hexo s
  • 反复进行调试、浏览后,推送到GitHub上(后文会讲解)
1
hexo d

注:关于hexo相关命令:

1
2
3
4
5
hexo generate(hexo g)      //生成本地静态文件,并创建一个public文件夹
hexo server(hexo s) //启动本地web浏览
hexo deploy(hexo d) //将博客部署到远端
hexo new "postname" //新建文章
hexo new page "pagename" //新建页面

二、关于GitHub Pages
1、一般GitHub Pages用于托管个人的项目,但是现在我们可以用来搭建自己的私人博客。但是需要注意的是。由于GitHub特殊的命名规定:每个账号只能有一个仓库存放个人主页,名字格式必须是:username.github.io。如图:
Ammw2F.png

2、关联Hexo和GitHub Page
在根目录下找到主配置文件:__config.yml,进行修改

1
2
3
4
deploy:
type: git
repo: git@github.com:username/username.github.io
branch: master

注:这里的username换成自己的,并且hexo的配置中冒号(:)与后文要有空格

3、安装扩展模板

1
npm install hexo-deployer-git –save

4、将本地部署推送到远端

1
hexo d -g

此时输入你的GitHub Page地址就可以访问了

关于主题页面优化以及创建文章和标签,请参考以下网址:
主题设置
高级使用技巧
添加分类和标签
发布文章

到这基本就结束了,一些其他优化和功能,大家自己去摸索

三、关于Typora

    这个东西是我用来进行Markdown编辑的一款非常简洁的编辑器,当然大家也可以去使用Visual Code,主要我是看中了它的简洁美观、实时预览、免费而且还支持跨平台。大家可以去官网进行下载。

    另外我们知道,Markdown很难受的一点就是它的图片插入和管理,所以我们需要一个稳定的地方来存放我们需要插入的图片也就是图床,这里我使用的是 路过图床,当你上传图片后自动给你生成很多链接包括markdown链接,或者大家也可以用微博的,但是它有个不好的就是所有图片都会给你转为jpg,而且有水印吧,或者可以试试 postimage

------ 本文结束 ------
您的支持将鼓励我继续创作