使用gitee(Sakura主题)+hexo部署blog，全网最详细

如何使用gitee+hexo在gitee上部署blog

我搭建的blog网站：kiloGrand

前期准备

• 下载git，推荐下载地址：链接 ，在腾讯软件中心下载比较快
• 下载nodejs 官方下载，我使用的版本是12.16.2，版本太高可能会出问题，推荐使用12.x.x系列的版本

安装软件

• 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

参考教程见 简书链接

1. 在github上新建一个名为cdn的仓库

2. 把下载好的cdn文件解压到E://cdn中，里面的图片可以替换，文件名最后不要改变，建议在cdn目录下加一个大小在20m以内的短视频，后面会用到，下面是修改后并且上传到github后的样子：
   

3. 打开git
   cd E://blog_project/cdn

4. 提交到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以下)

5. 发布仓库：浏览器打开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配置

1. 首先，在gitee上新建一个仓库，仓库名为你的账户名

2. 用编辑器打开blog文件夹，我用的是vscode：

3. 把blog/source中的所有md文件、blog/themes/Sakura/languages/zh-cn.yml和blog/themes/Sakura/_config.yml中的 ‘https://cdn.jsdelivr.net/gh/…’ 改成自己的cdn的文件链接。

4. 按照官方文档进行配置，每当配置完一部份，可以使用下面的命令来生成网页，访问http://localhost:4000查看网站效果
   $ hexo clean
   $ hexo g
   $ hexo s

5. 配置scaffolds文件夹下的md文件，这个文件夹是关于博客文章的。

注意：在配置首页媒体时，aplayer的ID是网易云音乐的歌单号，比如https://music.163.com/#/playlist?id=4958788236 ，它的ID是 4958788236，只需把原来的ID替换成你想要的歌单的ID就行了，其实这个项目的所有的音乐部分的ID都是网易云歌单号的ID，你可以用自己的网易云账户创建一个歌单，供blog使用。

blog部署

1. 生成部署文件
   $ hexo clean
   $ hexo g
   $ hexo d //上传到远程在码云上的仓库
2. 登录码云账户，打开和自己用户名相同的仓库, 点击服务，打开giteePages，点击开启。

深入开发

• xx博客
• hexo文档

常见错误

• 无法push到gitee/GitHub，可能是邮箱没有设置好，或者是_config.yml中的repo配置错了
• hexo -g生成的public中的index是空的，可能是nodejs的版本太高，建议安装nvm来切换nodejs的版本

博客使用

编写文章的两种方法：

• 在git下执行
  $ hexo new 博客文章名
  同时会在 根目录下 /source/_posts 目录下生成md文件
• 手动到根目录下 /source/_posts 目录下，创建一个makedown 文件进行编写就可以了