前言：之前学习云服务器时搭建过个人网站，现在我的云服务器停止维护了，现就博客模块（基于Gitee+Hexo搭建个人博客），之前有很多在github上用Hexo模板或express模板搭建个人博客的教程，但访问速度原因，现就码云进行实操并记录搭建过程。

一、准备

node.js下载，官网：https://nodejs.org/zh-cn/
Git下载，官网：https://git-scm.com/
根据提示安装即可。（ps.我的安装记录及cnpm镜像源更换参考）

查看node.js版本
在这里插入图片描述
git版本
在这里插入图片描述

二、hexo博客模板

hexo中文官网：https://hexo.io/zh-cn/

  1. 新建一个MyWeb目录，这个目录很重要，将来会存储你所有博客的markdown文件以及生成的html文件，==慎重选择==。

  2. 选中MyWeb目录，右键点击Git Bsah Here
    在这里插入图片描述

  3. 安装hexo

     npm install hexo-cli -g

    如果网速慢，可以采取cnpm安装在这里插入图片描述

  4. 初始化hexo模板

     hexo init

    目录分析：

    • 安装完成后的目录：
      在这里插入图片描述)在这里插入图片描述
    • 其中，目录MyWeb\source\_posts下存放都为makedown（md）格式文件
      在这里插入图片描述

  5. 运行hexo
    常用hexo三句话：

     hexo clean # 清空已有hexo网站文件
 hexo generate(or g) # 依据网页文本与新的CSS样式生成新网站文件
 hexo server(or s) # 启动本地服务器，可以在localhost:4000查看网站修改效果

    在浏览器输入http://localhost:4000就能查看演示样式helloworld页面：
    在这里插入图片描述
    一般默认的是一个landscape主题，后期当提交新文章或者新的样式修改时，往往都是先从本地查看结果无误后再部署到Gitee Page。

  6. 主题下载

    官网主题：https://hexo.io/themes/
    推荐两款：

    进入github点击下载zip：https://github.com/honjun/hexo-theme-sakura
    解压文件夹，将hexo-theme-sakura-master\themes中的主题样式复制MyWeb\themes目录下：
    在这里插入图片描述)在这里插入图片描述

  7. 主题配置在MyWeb主目录找到：_config.yml，记事本打开并修改默认theme: landscape为

     theme: sakura # 这里需要注意:后面要有一个空格，名称要和theme下的主题目录名称相同。

  8. 重新测试运行

     hexo clean
 hexo g
 hexo s

    在这里插入图片描述

    细节修改参考：sakura使用教程

三、码云配置

  1. 申请码云账户，新建仓库
    注意：仓库名，公开访问权限，语言为JavaScript
    在这里插入图片描述

  2. 获得仓库地址：
    在这里插入图片描述

  3. 修改配置在MyWeb主目录找到：_config.yml，记事本打开并修改默认
    在这里插入图片描述 -》在这里插入图片描述
    其中repo后面为你的仓库地址，每个：后都有一个空格。

     deploy:
   type: git
   repo: 你的项目地址
   branch: master

  4. 部署博客

     npm install hexo-deployer-git --save
 hexo g --d  #一键部署

    此时会弹出一个对话框，提示输入码云的账号密码。部署成功后，登陆码云。此时本地文件夹中出现有一个public文件夹，代表部署成功。
    在这里插入图片描述
    目前，查看码云中文件为：
    在这里插入图片描述
    本地多个public文件夹：
    在这里插入图片描述

  5. 开启Page功能
    在这里插入图片描述
    之前我的配置已为https，已勾选。修改位置如下图：
    在这里插入图片描述
    部署成功后如图：网址为登录网址：
    在这里插入图片描述

  6. 访问博客 https://cungudafa.gitee.io

四、博客使用

Hexo(sakura)主题简介

  1. 在博客目录的source文件中的_post文件夹中添加你要写的博客文件，文件命名为file_name.md
    file_name.md的文件开头如下:

     ---
 title: file_name
 tag: 标签名
 categories: 分类
 comment: 是否允许评论(true or false)
 description: 描述
 ---
 文档正文编写，请参照markdown语法。

    示例：
    在这里插入图片描述

  2. 发布文章并推送到gitee上
    在这里插入图片描述
    推送成功：
    在这里插入图片描述
    目前的内容是将md格式文件自动生成对应目录，转换成html格式显示。
    在这里插入图片描述
    再点击技术文档时，没有加载index.html
    在这里插入图片描述
    在这里插入图片描述

  3. 手动更新Gitee端
    其实运行了hexo deploy(or d)应该就已经将新的网站文件（主要是网站目录下的public目录）上传到了Gitee，然而事实上上步之后直接访问网站URL会发现页面没有改变，原因在于：你、没有、更新！
    https://gitee.com/cungudafa/cungudafa/pages 服务中选择更新：
    在这里插入图片描述 在这里插入图片描述
    是的，对于免费Gitee用户而言，你会需要手动更新一下Gitee Page，然后才可以将修改真的“部署”到可访问的网站上。

再访问：
在这里插入图片描述

总结：

  1. 个人博客修改
    博客目录在source文件中的_post下，文件命名为file_name.md
    file_name.md的文件开头如下:

     ---
 title: file_name
 tag: 标签名
 categories: 分类 #分类在sakura显示才能查看
 comment: 是否允许评论(true or false)
 description: 描述
 ---
 文档正文编写，请参照markdown语法。

  2. 发布：

     hexo clean # 清空已有hexo网站文件
 hexo g --d# 依据网页文本与新的CSS样式生成新网站文件,并一键发布
 hexo s # 启动本地服务器，可以在localhost:4000查看网站修改效果

    免费使用gitee还需手动更新page。

  3. hexo博客模板样式很多，需要一次详细的修改，能为博文锦上添花！

赏