用hexo搭建博客以及多种自动化部署方法

利用GitHub pages 搭建博客以及部署

  1. 首先在hexo官网下载hexo-cli,之后按官网的命令初始化博客

  2. 之后依次运行hexo clean hexo g ,hexo s,这时候你就可以在你的本地查看博客了

  3. 如果想要使用GitHub-page托管你的博客,则你需要新建一个GitHub仓库,仓库名命名为xxx.github.io,一定要以github.io结尾,如图image-20220418113645763

    • 之后在你的本地博客文件李找到_config.yml文件,这里url填写你仓库的地址,以我的为例,就是箭头所指的那样子,如果你想要自定义选择自己的域名,则url按箭头的上一行那样子填写自己的域名,这里我选择了的是自己的域名。 image-20220418113839968

    • _config.yml文件中找到deploy配置,这里typegit,repo填你的仓库地址,这里建议使用ssh的方式,也可以使用https的方式,branch填你想使用哪个分支来部署,一般是用main 或者master ,这里我专门建了一个分支来部署博客,因此我这里填的是docsmessage:是指commit的信息,可以自定义,也可以也不填,使用默认值

      deploy:
        type: git
        repo: git@github.com:left0ver/blog.github.io.git
        branch: docs
        message: updated:{{ now("yyyy-MM-DD HH:mm:ss") }}
      
    • 之后在vscode命令行运行 npm install hexo-deployer-git --save,安装hexo-deployer-git这个包

  4. 之后找到你的仓库的setting,点击它image-20220418114138247

  5. 左侧找到pages来,设置你的博客的所在的分支,我这里新建了一个分支docs专门来存放博客的页面,你也可以直接使用main或者master分支,右侧选root

    下面你可以选择发布站点时的主题,这个选不选都无所谓,最下面那个是自定义域名,如果你使用自定义域名,则填写对应的域名,如果你不是使用自己的域名,则不用配置image-20220418114247687

    • 如果你不是选择的使用自己的域名,则可以依次运行hexo clean ,hexo g,hexo d ,之后就会把生成的public文件夹提交并push到你上面配置的的GitHub对应的分支上了,如果提交不成功则多试几次,然后你可以使用GitHub pages页面中所提供的url访问你的网站了。
    • 如果你是选择的使用自己的域名,则需要到对应的云服务厂商中配置对应的域名解析,具体请往下看,这里我选择的是阿里云
  6. 首先先打开本地命令行,ping 一下[usename].github.io ,username那里填写你自己的GitHub用户名,之后记住上面显示的那个ip,我这里是185.199.109.153

    image-20220418163626860

    • 如果你用的不是子域名,例如leftover.cn这种,则找到云服务商对应的域名解析,添加两条记录,如下图,第一条中的那个记录值填写第8步得到的那个ip,第二条如下图:只需把记录值中的那个用户名那个换成自己GitHub用户名即可,完成之后等待10分钟

      image-20220418164206849

    image-20220418163841386

  • 如果你用的是子域名,例如blog.leftover.cn 这样子的,则添加一条记录即可,方法和上面类似,如图

    image-20220418175123625

  1. 之后再你的GitHub的那个分支里会多出这样一个CNAME文件,打开它,复制里面的内容,然后在本地的博客文件夹里面找到source文件夹,新建一个CNAME文件,粘贴复制的内容,CNAME文件的内容其实就是你的网站域名,例如blog.leftover.cn,之后重新运行hexo clean,hexo g,hexo d,就可以用自己的域名打开博客了image-20220418164700340

    image-20220418164829524

直接部署到云服务器

  • 上述讲的是利用GitHub Pages来实现部署,倘若你不想通过GitHub pages来部署,想直接部署到自己的云服务器,官网说的是利用hexo-deployer-rsync 插件来部署到云服务器,但是经过一番尝试,这个方法太麻烦了,里面的坑很多,官网也没有详细的教程,最后找到了另一种方法,详细请看视频,亲测有效。

鸣谢

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值