Hexo + Gitee Pages 搭建个人博客

简介: Hexo + Gitee Pages 搭建个人博客

我是 数据科学与大数据技术专业的一名大三学生,为了学习运维,了解到了 飞天加速计划·高校学生在家实践活动,下面是 Hexo + Gitee Pages 搭建个人博客 的教程

一、开发环境搭建

1. Node.js 安装

  • 进入 Node.js 官网,下载左边的 LTS (长期支持)版

https://nodejs.org/en/

image-20210906200304204.png

  • 打开安装包

image-20210906200628455.png

  • 同意协议

image-20210906200645500.png

  • 选择安装路径

image-20210906200739570.png

  • 自动安装必要工具

image-20210906200816319.png

  • 点击安装

image-20210906200913153.png

  • 安装完成

image-20210906200917483.png

  • 自动下载必要工具

image-20210906201002357.png

image-20210906201033927.png

2. Hexo 安装

  • 新建博客文件夹,点击 Git Bash Here 打开

image-20210906201643481.png

  • 输入以下命令安装 Hexo(部分主题不兼容最新版本,故使用4.2.0版本)
npm install hexo@4.2.0 -save

image-20210906201757155.png

  • 安装成功

image-20210906201942410.png

二、初始化博客并生成文章

1. 初始化博客

  • 输入以下命令,初始化博客
hexo init

image-20210906202804634.png

  • 输入以下命令,生成博客文章
hexo generate

hexo g

image-20210906203022154.png

  • 输入以下命令,启动服务器
hexo server

hexo s

image-20210906203122010.png

  • 打开网页以访问博客

image-20210906203221930.png

image-20210906203310924.png

2. 新增博客文章

  • 输入以下命令,新增博客文章
hexo new "你的文章标题"

image-20210906203544499.png

此命令默认会在博客目录下的\source\_posts\下创建你的博客文章

  • 打开此文件,写入内容并保存

image-20210906203831190.png

  • 生成文章
hexo g

image-20210906203940862.png

  • 启动服务并打开网页
hexo s

image-20210906204031832.png

image-20210906204048932.png
image-20210906204353746.png

新增博客成功

二、将本地博客发布并部署到Gitee Pages上

  • 打开 Gitee ,新建一个仓库,仓库名与用户名一致,直接创建

image-20210907163557433.png

  • 进入仓库,点击 克隆/下载,复制 Https 地址

    image-20210907163637013.png

  • 打开博客根目录,修改_config.yml 文件

image-20210907163749619.png

  • 修改以下内容
deploy:  type: git  repo: 自己的Gitee仓库  branch: master

image-20210907164140694.png

  • 安装 Hexo Git 插件
npm install hexo-deployer-git --save

image-20210907164249551.png

  • 将博客部署到 Gitee

    hexo deploy

    hexo d

image-20210907164824427.png

  • 部署成功

image-20210907164719732.png

  • 进入 Gitee 仓库,发现博客已经上传成功

image-20210907164939442.png

  • 点击服务中的 Gitee Pages,更新服务

image-20210907165029899.png

image-20210907165951988.png

  • 访问博客地址

image-20210907170009970.png

  • 部署成功

image-20210907170034367.png

相关文章
|
域名解析 JavaScript 开发工具
通过Git Pages+Hexo搭建自己的博客
Hexo是一款基于Node.js的静态博客框架,依赖少易于安装使用,可以方便的生成静态网页托管在GitHub和Coding上,是搭建博客的首选框架。本文通过实例介绍如何通过Git Pages+Hexo搭建自己的博客。
98 0
|
存储 程序员
30分钟使用Docsify+Github Pages搭建个人博客
30分钟使用Docsify+Github Pages搭建个人博客
332 0
30分钟使用Docsify+Github Pages搭建个人博客
|
Windows
Hexo+GithubPages免费搭建个人博客网站(上)
Hexo+GithubPages免费搭建个人博客网站
Hexo+GithubPages免费搭建个人博客网站(下)
Hexo+GithubPages免费搭建个人博客网站(下)
|
JavaScript 安全 前端开发
【Gitee + Hexo】从0开始搭建自己的博客网站
【Gitee + Hexo】从0开始搭建自己的博客网站
255 0
|
JavaScript 网络协议 Shell
Hexo+GitHub+Vercel搭建个人博客网站
直接安装,完成后,在cmd上输入node -v和npm -v查看是否安装成功,这两条命令如果都输出了版本号,那么就表示安装成功了
718 0
|
JavaScript 前端开发 Shell
一篇带你用 VuePress + Github Pages 搭建博客
最近完成了 TypeScript 最新官方文档 Hanbook 的翻译,一共十四篇,堪称国内的最好 TypeScript4 入门教程之一。为了方便大家阅读,我用 VuePress + Github Pages 搭建了博客。
1019 1
一篇带你用 VuePress + Github Pages 搭建博客
|
域名解析 缓存 JavaScript
GithubPages + Hexo 打造免费个人静态网页博客
作为程序员为什么要写技术博客,一方面是为了养成做笔记做总结的习惯,一方面也能做些有用的知识分享,提高写作能力,其实有很多不错的博客平台都可以用,比如在掘金发布博客文章,但是如何在不需要域名空间和博客程序下,低成本的拥有属于自己的博客网站呢?
|
存储 运维 JavaScript
使用hexo在GitHub上搭建个人博客
使用hexo在GitHub上搭建个人博客
使用hexo在GitHub上搭建个人博客
|
开发工具 git
【Hexo】【Gitee】Hexo + Gitee搭建的个人博客如何在一个库里写博客和更新Gitee Pages?
【Hexo】【Gitee】Hexo + Gitee搭建的个人博客如何在一个库里写博客和更新Gitee Pages?
173 0
【Hexo】【Gitee】Hexo + Gitee搭建的个人博客如何在一个库里写博客和更新Gitee Pages?

热门文章

最新文章