如何使用gitee+hexo在gitee上部署blog
我搭建的blog网站:kiloGrand
前期准备
安装软件
- git 除了安装路径可以改之外,其他的不用改,一直next就行
- nodejs 同上
注册Gitee和GitHub账号
github官网
gitee官网
注意:在gitee和github中的设置-多邮件管理中, " [ ] 不公关我的邮箱地址",这里不打勾,同时也要把你的邮箱设为提交邮箱
- 下载hexo主题sakura github的Sakura链接 ,推荐下载链接:gitee的Sakura下载链接
- 下载cdn文件 cdn文件github下载链接 ,推荐下载链接:cdn文件下载gitee链接
gitee上下载文件的方法:点击右上角克隆/下载—下载zip
初始化项目
- 配置git
打开git
$ git config --global user.name ‘gitee用户名’
$ git config --global user.email ‘gitee登陆邮箱’ - 安装hexo
$ npm install hexo-cli -g - 安装hexo-deployer-git
$ npm install hexo-deployer-git --save - 初始化项目
$ cd E://blog_project
$ hexo init blog
$ cd E://blog_project/blog
$ hexo g //依据网页文件和新的css样式生成新的网站文件
$ hexo s //启动本地服务器,可以在http://localhost:4000查看网站效果
使用jsDeliver+github搭建免费的cdn
参考教程见 简书链接
-
在github上新建一个名为cdn的仓库
-
把下载好的cdn文件解压到E://cdn中,里面的图片可以替换,文件名最后不要改变,建议在cdn目录下加一个大小在20m以内的短视频,后面会用到,下面是修改后并且上传到github后的样子:
-
打开git
cd E://blog_project/cdn -
提交到github仓库上
git init //初始化
git status //查看状态
git add . //把该目录下的所有文件添加到暂存区
git commit -m '第一次提交' // 把暂存区的文件提交到本地库
git remote add github cdn仓库链接 //关联远程仓库
git pull --rebase github master //合并远程仓库和本地仓库的冲突
git push github master //推送到远程仓库上
(jsDeliver不支持加载超过20M的资源,所以一些视频最好压缩到20M以下)
- 发布仓库:浏览器打开github中新建的cdn,点击release发布, 发布版本号1.0(自定义)
使用方法:
https://cdn.jsdelivr.net/gh/user/repo@version/file
https://cdn.jsdelivr.net/gh/user/repo/file
eg: https://cdn.jsdelivr.net/gh/kiloGrand/cdn@1.2/img/custom/avatar.jpg https://cdn.jsdelivr.net/gh/kiloGrand/cdn/img/custom/avatar.jpg
版本号不是必需的,是为了区分新旧资源,如果不使用版本号,将会直接引用最新资源
blog配置
-
首先,在gitee上新建一个仓库,仓库名为你的账户名
-
用编辑器打开blog文件夹,我用的是vscode:
-
把blog/source中的所有md文件、blog/themes/Sakura/languages/zh-cn.yml和blog/themes/Sakura/_config.yml中的 ‘https://cdn.jsdelivr.net/gh/…’ 改成自己的cdn的文件链接。
-
按照官方文档进行配置,每当配置完一部份,可以使用下面的命令来生成网页,访问http://localhost:4000查看网站效果
$ hexo clean
$ hexo g
$ hexo s -
配置scaffolds文件夹下的md文件,这个文件夹是关于博客文章的。
注意:在配置首页媒体时,aplayer的ID是网易云音乐的歌单号,比如https://music.163.com/#/playlist?id=4958788236 ,它的ID是 4958788236,只需把原来的ID替换成你想要的歌单的ID就行了,其实这个项目的所有的音乐部分的ID都是网易云歌单号的ID,你可以用自己的网易云账户创建一个歌单,供blog使用。
blog部署
- 生成部署文件
$ hexo clean
$ hexo g
$ hexo d //上传到远程在码云上的仓库 - 登录码云账户,打开和自己用户名相同的仓库, 点击服务,打开giteePages,点击开启。
深入开发
常见错误
- 无法push到gitee/GitHub,可能是邮箱没有设置好,或者是_config.yml中的repo配置错了
- hexo -g生成的public中的index是空的,可能是nodejs的版本太高,建议安装nvm来切换nodejs的版本
博客使用
编写文章的两种方法:
- 在git下执行
$ hexo new 博客文章名
同时会在 根目录下 /source/_posts 目录下生成md文件 - 手动到根目录下 /source/_posts 目录下,创建一个makedown 文件进行编写就可以了