原文在 0xFFFF CS Wiki 本文面向无基础学生。博客为静态博客，无需费用。使用的工具和框架： GitHub Pages + hexo 为什么要搭建个人博客将自己的思考和学习经历记录下来作为一个知识沉淀的平台在搭建博客和升级博客的过程中学习技术展示你自己，并且可以作为他人了解你的渠道成为社区的一份子，帮助到他人。博客中记录的bug和经历可以让更多的人少走弯路。优秀的个人博客推荐：轮子哥/vczh 鳥哥的 Linux 私房菜王垠阮一峰的个人网站使用GitHub page + hexo快速搭建环境准备安装 Node.js 和 Git 并注册 GitHub 安装成功检验：在命令行执行下列命令： $ git --version git version 2.9.0.windows.1 $ node --version v10.15.3 $ npm --version 6.4.1 if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } 安装Hexo 在命令行执行下列命令： $ npm install -g hexo-cli # -g 代表着全局安装 if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } 完成后建立你的个人博客： $ hexo init blogName $ cd blogName $ npm install if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } 博客文件夹的目录如下： ├───.git ├───scaffolds # 博客的模板文件夹 ├───source # 资源文件夹 │ └───_posts # 你的博客源文件(.md) └───themes # 主题文件夹 └───landscape # 默认主题 ├───.gitignore ├───.gitmodules ├───_config.yml # 博客的配置文件 ├───package.json # 项目管理文件 if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } 创建你的第一篇博文新建一篇博文： $ hexo new '文章标题' if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } 在 /source/_posts 文件夹下找到你的博文，使用Markdown编辑器打开并编辑。推荐使用Typora进行编辑。在 Markdown Guide 或者菜鸟教程学习Markdown语法。保存后运行： $ hexo generate # 生成静态文件，可简写为 hexo g $ hexo server # 启动服务器。默认情况下，访问网址为：`http://localhost:4000/`。可以简写为 hexo s if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } 此时已经可以在 public 文件夹下看到完整的静态文件。在浏览器中输入 http://localhost:4000/ 就可以看到预览效果了。部署到GitHub Pages 在GitHub创建一个名为 username.github.io 的新仓库，其中 username 是您在GitHub上的用户名（或组织名称）。 ! 如果仓库的第一部分与您的用户名不完全匹配，则它将不起作用，因此请确保正确无误。转到要存储项目的文件夹，然后克隆新的仓库： $ git clone https://github.com/username/username.github.io if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } 将之前生成的 public 文件夹下的文件拷贝到本地仓库中。再运行： $ git add --all $ git commit -m "Initial commit" $ git push -u origin master if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } 等待一段时间你就可以启动浏览器并转到 https://username.github.io 你就可以看到自己的博客啦！ // 将博客部署到GitHub还有其他方法，比如可以使用 hexo deploy 。这个就请自行学习探索啦。了解并丰富你的博客以下是一些进阶网站：超详细Hexo+Github Page搭建技术博客教程 hexo官网 GitHub Pages 进阶博客搭建想必很多同学在完成简单的静态博客搭建后都想尝试更加绚丽，互动性和自定义更强的博客。首先你需要购买一个域名，拥有一个服务器。使用 WordPress 可以快速搭建一个动态博客。如果你不仅仅满足于使用框架和平台，那么你可能需要去了解并学习一些更加深入的东西，前端可以用Vue或者React，后端用python的Django,Flask框架实现快速开发个人博客。

补充几个框架：基于Go的 hugo , Typecho ,

赞！！可以抛弃充满广告的 XSDN、XX园、X书了🌞 博客本身就是一种“我为人人，人人为我”的氛围下的体现，寄托于商业平台并不是那么靠谱，开源才是最好的归宿。搞起！

MikyMing 基于Go的 hugo , Typecho , 纠正下，Typecho 是基于 PHP 的，设计上和 WordPress 类似，但更加地精简。

之前搭建的Hexo博客一直荒废，看了这个帖子提醒我在我的Mac上重新部署起来。哈哈哈。折腾！搞这个前提有两个： 1、懂得用MD写作；不用MD写作，这个Hexo也就没意义了。 2、懂得Git的基本使用；这个前提有点隐秘，因为 hexo d 似乎已经把细节隐藏了，只是，本质上还是要Git。至于其他的问题，包括：主题、布局、部署到其他的软件仓库等等细节，深入做下去还是需要很多很多功夫。我一般都不折腾。能用就行的那种。今天我试图把之前的博客迁移到新的机器，不怎么成功（看了很多的帖子，都不怎么好用）。反正之前也没写什么，不如重新写。但是，如何迁移博客还是值得研究的。

Bintou 迁移的话，一般整个目录拷贝过去就可以了，可能需要删掉里面的 node_modules 重新装下依赖。

突然发现一个巨大的问题，如何让Hexo支持Latex！参考一下这篇博客，还没折腾。还是需要很多时间去搞的。

用gitee pages部署速度更快点

交作业： https://colindowney.github.io/ 过一段时间赶完作业慢慢折腾w

lin_cx 看了下，默认不支持 HTTPS 和自定义域名，还是挺局限的。

MikyMing 部署到GitHub Pages 这一步似乎并不应该另外克隆仓库下来诶，这样的话其实每一次修改都得把public文件夹下的内容复制过去。其实Hexo已经包括了git的操作。我的操作如下：打开 Git Bash 并且进入之前创建的文件夹（默认在C:\Users\Username\BlogName\），运行 npm install hexo-deployer-git --save 安装插件；打开文件夹里面的_config.yml，拉到文件末尾添加以下信息（注意修改GitHub的账户名）：运行 hexo g -d 即可部署。参考： Github和Hexo搭建博客

搭建一个自己的博客

Rapiz1

分享一个自己给 Hexo 博客做 SEO 的记录 https://rapiz.me/2020/blog-seo/
博客自己写了两三年了一直没在意搜索引擎收录，最近开始关心这一块，想办法提高在搜索结果中的出现频率和排名。
因为是自己写的主题，所以我需要从 0 开始加 <meta> 标签。如果用的是成熟的博客主题，可能已经包含 <meta>, 就不需要这一点优化了。

wzpan

Hexo 社区开发者飘过。欢迎使用我的 hexo-generator-search 。🙂

c10udlnk

wzpan ！折腾完博客以后惊奇地发现开发者（博客用的melody主题刚好支持这个search的使用！

Bintou

每年新生入学之后都可以推一下的帖子。折腾起来！

Error

Error 刚刚有人告诉我，这种源码private的GitHub博客已经有现成的GitHub action了，链接：https://github.com/sma11black/hexo-action

luo_

本来已经折腾好了最简单的博客，然后之前改了个Next主题直接网页index爆错了一直解决不了，于是决定重新开始，按着帖子的步骤，可还是一直卡在hexo init Blogname，想问一下是第二次安装存在缓存什么问题吗还是？折腾了一下午无果/哭
这是错误

charfole

luo_
看报错内容应该是 git 的问题，先试试配置一下本地的 git 环境？

aukocharlie

luo_ Permission denied 导致的 clone 失败，间接导致 no such file？（建议不要在 C 盘开发，重装就玩完，还要搞权限的东西也麻烦

luo_

charfole 重新部署在E盘，已解决了哈

luo_

aukocharlie 重新部署在E盘，可以了，(确实，也不知道当时咋想的，装在C盘)

charfole

luo_ 解决了就好，一个一个坑慢慢填吧~ 分享一个我当时搭博客看的视频，感觉还讲得挺不错的，包含了Github Action 内容，实现保存源码的同时自动更新站点的功能，可以参考一下。

luo_

Colin_Downey 搞了一个克隆仓库才看到这，然后跟着也搞了这个插件，好像没有效果，是不是得重新删除仓库开始呀

Colin_Downey

luo_ emmmm我不太记得了，但我觉得可能是git的问题？

luo_

charfole 早上重新弄了一下，发现这个错误好像跟DNS的设置有关

因为之前修改了DNS为114.114.114.114，如下

导致报错，将DNS修改为自动，问题解决，但不知道是什么原因...

luo_

Colin_Downey 早上重头弄了，可以了！CV键可以多用几个月了

charfole

luo_ 根据第二三行的报错信息，我猜应该是更改 DNS 之前有网络问题，所以在 clone 那一步，也就是访问 github 的时候出现了错误吧。

wzpan

对了。最近将hexo的部署从Github Pages+travis ci的方案迁移到了Vercel。发布速度更快，而且免费账号就能支持自定义域名，体验非常好。
推荐大家试试。

0x0001

wzpan vercel 确实好用，记得以前还是叫 now.sh，感觉它真正意义上解决了静态站部署的学习和维护成本。并且里面自带了 node 环境，网站加载首屏渲染的痛点问题也解决的很好。

之前尝试了下它家的 Next.js，感觉用起来也特别舒适，直接参与进 React 周边生态的建设，然后把自己的服务变成了其中一个环节，用户不知不觉就进坑了哈哈～特别佩服

wzpan

过了几天我又把博客改回了 Github Pages …… 因为我被告知超出了 vecel 的流量限制。

是我低估了我那一年一更的博客的访问量。(哭笑不得.jpg) ~

wzpan

soft

可能会有人有跟我遇到一样的问题，我把解决的方法发出来。

如果用hexo-asset-image 插件，渲染成html时生成的图片路径会出错。（如果你也使用的是相对路径的话，像下图一样）
那么推荐一个插件 hexo-image-link

配置好后就可以正常显示了

这样既可以在typora里即时预览本地图片，在生成包含相对路径图片的静态页面时不用做额外操作。

不过插件有个小bug：图片名称不能包含空格