前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Hexo搭建静态博客

Hexo搭建静态博客

作者头像
用户2700375
发布2022-06-09 14:24:31
2900
发布2022-06-09 14:24:31
举报
文章被收录于专栏:很菜的web狗
u=3010013829,2497003625&fm=26&gp=0.jpg
u=3010013829,2497003625&fm=26&gp=0.jpg

最新折腾了一下黑苹果 刚刚把博客迁移过来 所以才想起写这篇文章 Hexo+GitHub搭建静态博客

准备工作

Node.js下载链接: https://nodejs.org/en/

Git下载链接: https://git-scm.com/download/win

安装好Node.js与Git 接下来安装Hexo

代码语言:javascript
复制
npm install -g hexo-cli

安装完成以后

git —version,hexo-v查看安装版本

本地建站

我们首先在本地搭建起Blog 等本地都配置完成直接放到GitHub就ok了

博客框架

初始化博客框架

代码语言:javascript
复制
hexo init <folder>(博客文件夹名称)
cd <folder>  // 进入博客文件夹目录
npm install

这时候博客应该会出现如下文件

屏幕快照 2019-02-19 下午9.48.41.png
屏幕快照 2019-02-19 下午9.48.41.png

_config.yml 是整个站点的配置文件 不要乱改

写文章进行测试

hexo new 文章名

屏幕快照 2019-02-19 下午9.57.31.png
屏幕快照 2019-02-19 下午9.57.31.png

记得在博客目录下 新建文章

可以看到新建了.md文件在 source/_posts/ 下 记住所有生成的文章都在此目录下

编辑.md 我用的是typora感觉比较好用 百度下载即可

生成静态文件

代码语言:javascript
复制
hexo generate
简写 hexo g 就好

启动服务器

接下来我们访问以下博客 先要启动一下hexo服务器

代码语言:javascript
复制
hexo server
简写 hexo s

启动以后我们本地访问以下

默认访问 http://localhost:4000

出现类似界面说明本地测试成功没有任何问题

屏幕快照 2019-02-19 下午10.08.17.png
屏幕快照 2019-02-19 下午10.08.17.png

更换主题

在博客目录下打开终端

代码语言:javascript
复制
git clone https://github.com/iissnan/hexo-theme-next themes/next

下载完成以后 打开博客目录下的_config.yml

找到theme 将theme的值改为next

QQ20190219-223900@2x.png
QQ20190219-223900@2x.png

之后输入调试命令

代码语言:javascript
复制
hexo server --debug

在访问以下http://localhost:4000应该就已经更换主题了哦

屏幕快照 2019-02-19 下午10.48.10.png
屏幕快照 2019-02-19 下午10.48.10.png

感觉排版并不是很舒服 需要改一下 找到主题配置文件

主题配置文件在博客目录 下的 themes/next/_config.yml

这里不要搞混 这个是主题配置文件

搜索 scheme 关键字。

QQ20190219-225208@2x.png
QQ20190219-225208@2x.png

前面去掉#号即为启用 我们启用pisces的样式

这之后样式看起来和我博客类似了

主题就先说到这 添加分类 标签 友联 界面语言等 自己Goolge吧

也可以参考 http://theme-next.iissnan.com/getting-started.html#avatar-setting

部署到GitHub

注册GitHub账号

这里自己注册一个账号就好了

建立新的存储库

根据GitHub用户名建立的存储库 如我的用户名scholar10所以存储库的名为scholar10.github.io

设置本地GitHub

填写 git邮箱 用户名

代码语言:javascript
复制
git config --global user.name  "user_name"
git config --global user.email "your_email_addr"

第一个填你github的用户名 第二天填写 注册github的邮箱

本地创建SSH

代码语言:javascript
复制
ssh-keygen -t rsa -C "1773256697@qq.com"

填自己注册github的邮箱地址就好

一路回车就好

生成的SSH添加到GitHub

创建完成以后打开用户的根目录 一般在C:\Users\username(你的用户名)

应该会有.ssh文件夹 这时候找到.ssh文件里面的ssh.pub(公钥)

将里面的内容全部复制到

屏幕快照 2019-02-20 上午11.16.12.png
屏幕快照 2019-02-20 上午11.16.12.png
屏幕快照 2019-02-20 上午11.20.15.png
屏幕快照 2019-02-20 上午11.20.15.png

点击 new ssh key 会出现 title框和key框 把 ssh.pub内容全部复制到 key框 title 随意写一个名字就好

验证SSH是否设置成功

代码语言:javascript
复制
ssh -T git@github.com

首次提示不能连接输入yes即可

接下来打开 博客目录下的_config.yml

代码语言:javascript
复制
deploy:
type: git
repo: https://github.com/username/scholar10.github.io.git
branch: master

类型配置为git 仓库地址为 建立的github仓库地址(scholar10替换成自己的)分支为master也就是主分支

然后执行部署命令

代码语言:javascript
复制
hexo deploy 简写 hexo g -d //生成静态文件后提交到github上

执行完成后 别人就可以通过

http://scholar10.github.io

访问你的博客了….

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2019-02-19,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 准备工作
  • 本地建站
    • 博客框架
      • 写文章进行测试
        • 生成静态文件
          • 启动服务器
            • 更换主题
            • 部署到GitHub
              • 注册GitHub账号
                • 建立新的存储库
                  • 设置本地GitHub
                    • 本地创建SSH
                      • 生成的SSH添加到GitHub
                      领券
                      问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档