作者在这里先说一下,网上说部署博客很简单的肯定是报错遇到几十遍摸索出来的,哪里有不简单这个道理。难不成天上掉馅饼了?
开始 创建Hexo初始页面(前提需要安装NodeJS和Git) 在你想要搭建博客的地方,右键选择 Open Git Bash Here
之后会打开一个窗口,等窗口加载完,在命令行窗口输入以下命令
然后就等他部署完之后,运行以下两个命令
完成之后打开 localhost:4000
如果打开不了的话,一般是由于windows系统的4000端口被占用了
修改端口: hexo s -p 5000 一般都能解决 (也可以 netstat -ano 查询所有端口信息,找到占用端口的程序关闭它)
如果还不能解决,是因为你的有部分Windows功能没有打开(IIS没有配置好)
打开控制面板 —- 程序和功能 —- 打开或关闭Windows功能 —— 勾选上Internet Informent Services ——-点击确定即可
这时候如果打开的话,游览器就会出现这个页面
如果你不嫌这个主题丑的话,那么就可以到Hexo d
修改主题 这里以Butterfly主题为例
打开你网站根目录下的theme文件夹
右键再次点击 Open Git Bash Here
在命令窗口内输入以下命令
git clone https://github.com/jerryc127/hexo-theme-butterfly.git
完成之后是theme文件夹内是这个样子
将刚刚克隆的主题文件夹改为 butterfly
最后将 _config.landscape.yml
改为 _config.butterfly.yml
,这个就是我们配置主题的文件
回到博客的根目录,打开 _config.yml
找到该文件如下设置项
将theme里的landscape
改成butterfly
(这是博客主题选项)
Ctrl+S
保存之后,运行以下三个命令
这样,主题也就更换完成了
当然,如果你进入游览器看到的页面是以下字符的话:
extends includes/layout.pug block content include ./includes/mixins/post-ui.pug #recent-posts.recent-posts +postUI include includes/pagination.pug
这就说明没有安装 pug 以及 stylus 的渲染器,请下载安装:
npm install hexo-renderer-pug hexo-renderer-stylus --save
再一次执行上面的三条命令,就可以运行了
配置主题 menu: 主页: / || fas fa-home 博文 || fa fa-graduation-cap: 归档: /archives/ || fa fa-folder-open 友链: /links/ || fa fa-link 关于笔者: /about/ || fas fa-heart highlight_theme: mac light highlight_copy: true highlight_lang: true highlight_shrink: false highlight_height_limit: false code_word_wrap: true local_search: enable: true labels: input_placeholder: Search for Posts hits_empty: "We didn't find any results for the search: ${query}" subtitle: enable: true effect: true loop: true source: false sub: - 你在抱怨什么呢 - 为明天到来的事,说人生像是没有意义 - 没有选择会是唯一的路 - 这不是你自己的问题,人终归要好好去生活 - 物质决定意识 - 人性一个最特别的弱点就是:在意别人如何看待自己 favicon: https://pic.imgdb.cn/item/65fae1259f345e8d03990fdc.png avatar: img: https://pic.imgdb.cn/item/65fe67989f345e8d03923ea6.jpg effect: false index_img: https://pic.imgdb.cn/item/664005ea0ea9cb1403455d4c.png default_top_img: https://pic.imgdb.cn/item/664005ea0ea9cb1403455d4c.png archive_img: https://pic.imgdb.cn/item/664005ea0ea9cb1403455d4c.png tag_img: https://pic.imgdb.cn/item/664005ea0ea9cb1403455d4c.png category_img: https://pic.imgdb.cn/item/664005ea0ea9cb1403455d4c.png cover: index_enable: true aside_enable: true archives_enable: true position: both medium_zoom: false fancybox: true post_copyright: enable: true decode: true license: CC BY-NC-SA 4.0 license_url: https://creativecommons.org/licenses/by-nc-sa/4.0/ aside: enable: true hide: false button: true mobile: true position: right card_author: enable: true description: button: enable: true icon: fab fa-github text: 查看我的Github主页!!! link: https://github.com/exef-star card_announcement: enable: true content: 欢迎来到可执行程序的博客V3.0版本,该博客为测试版,如有Bug请QQ给作者:2667174454(Hexo:Butterfly) social: fab fa-github: https://github.com/exef-star || Github fab fa-qq: https://user.qzone.qq.com/2667174454?_t_=0.3701241711847538 || QQ fas fa-envelope-open-text: mailto:wy2667174454@163.com || 163 Email toc: post: true page: false number: false expand: true style_simple: false scroll_percent: true fireworks: enable: false zIndex: 9999 mobile: false wordcount: enable: true post_wordcount: true min2read: true total_wordcount: true preloader: true runtimeshow: enable: true publish_date: 5 /12/2024 00 :00:00 footer: owner: enable: true since: 2022 custom_text: <p> <a style="margin-inline:5px"target="_blank" href="https://hexo.io/"> <img src="https://img.shields.io/badge/Frame-Hexo-blue?style=flat&logo=hexo" title="博客框架为 Hexo" alt="HEXO"> </a> <a style="margin-inline:5px"target="_blank" href="https://butterfly.js.org/"> <img src="https://img.shields.io/badge/Theme-Butterfly-6513df?style=flat&logo=bitdefender" title="主题采用 Butterfly" alt="Butterfly"> </a> <a style="margin-inline:5px"target="_blank" href="https://github.com/"> <img src="https://img.shields.io/badge/Source-Github-d021d6?style=flat&logo=GitHub" title="本站项目由 GitHub 托管" alt="GitHub"> </a> <a style="margin-inline:5px"target="_blank"href="http://creativecommons.org/licenses/by-nc-sa/4.0/"> <img src="https://img.shields.io/badge/Copyright-BY--NC--SA%204.0-d42328?style=flat&logo=Claris" alt="img" title="本站采用知识共享署名-非商业性使用-相同方式共享4.0国际许可协议进行许可"> </a> </p> copyright: false font: global-font-size: 16px code-font-size: 16px font-family: SegoeUI,"Segoe UI", "Microsoft YaHei UI Light" , 微软雅黑, "Helvetica Neue" , Helvetica, Arial, sans-serif code-font-family: consolas, Menlo, "PingFang SC" , "Microsoft JhengHei" , "Microsoft YaHei" , sans-serif busuanzi: site_uv: true site_pv: true page_pv: true noticeOutdate: enable: true style: flat limit_day: 365 position: top message_prev: 并未过期!!! message_next: 自上次更新以来的天,文章的内容可能已过时!!! related_post: enable: true limit: 6 date_type: created
新建文章 在Bash
中输入以下命令
上传到Github 创建一个SSH秘钥(自行百度)
在Github上登录账号(没有的可以注册一个)
然后打开你需要部署的仓库,点击右上角的Code
复制SSH
秘钥
然后打开博客根目录下的_config.yml
找到最后的配置项deploy:
将刚刚复制的SSH
秘钥粘贴在repo:
详细配置如下:
deploy: type: 'git' repo: 粘贴上SSH branch: master
之后运行以下命令
hexo c && hexo g && hexo d
再开启GithubPage服务,访问username.github.io
小插曲
Hexo同步更新Github仓库,但不更新Page
这里因为github将默认分支改为了main
,所以要用户自行修改分支名
然后在左侧侧边栏中的Pages选项中选择经典部署
将分支改为我们刚才改的main
分支
再切回Github Actions,来到Actions检查,你会发现Page现在正在部署,不一会就更新完成了,这时候访问就可以看到我们更新的内容
那么到这里,感谢你阅读完了全文,拜了个拜👋