Re:Hexo博客入门「想搭个人博客?这篇零基础小白也能学会的精修教程请收好」

张开发
2026/4/13 7:38:11 15 分钟阅读

分享文章

Re:Hexo博客入门「想搭个人博客?这篇零基础小白也能学会的精修教程请收好」
◆ 博主名称 晓此方-CSDN博客大家好欢迎来到晓此方的博客。⭐️番外篇个人专栏 话题⭐️Re系列专栏我们思考 (Rethink) · 我们重建 (Rebuild) · 我们记录 (Record)文章目录概要序論一什么是Hexo二下载前置工具与Hexo2.1前置软件安装2.2Hexo的安装三用Hexo部署博客网站3.1创建一个文件夹来放博客资源3.2初始化一个博客3.3创建第一篇博客3.3.1看看初始化后的样子3.3.2先写一篇博客3.3.3同步到hexo上去3.4基于github博客免费远端部署3.4.1创建一个新仓库3.4.2下载和配置Hexo插件3.4.3部署到远端Hexo常用指令总结概要序論这里是此方好久不见。在算法推荐与碎片信息的包围中拥有一个独立博客如同经营一片纯粹的精神后花园。本教程将带你零基础解锁 Hexo从环境配置到本地部署手把手将枯燥的代码转化为极简精致的个人网页。让我们现在开始吧。此方为什么要写这篇文章虽然 Hexo 官方文档依然在那但坦白说由于版本更迭部分内容已略显“高龄”对新手并不完全友好。我常看到粉丝朋友因为找不到一份完整、过时的指南而走弯路。于是这个系列的文章它来了。本教程只是在Windows11系统下示范其他系统操作方法其实基本完全一致一什么是Hexo简单来说Hexo 是一个基于 Node.js 的静态博客框架。它不像 WordPress 那样需要数据库支持而是直接将你的 Markdown 文档“编译”成极速运行的 HTML 网页。极速生成得益于 Node.js 的高并发特性数百篇博文瞬间即可完成渲染。极致轻量生成的静态文件可一键部署至 GitHub Pages无需服务器终身免费且永不崩溃。无限扩展拥有海量的极客风格主题和插件支持高度自由的二次开发。在极客眼里Hexo 就是将“写作”与“编译”完美融合的效率工具。二下载前置工具与Hexo2.1前置软件安装Node.js (核心地基)Hexo 是基于 Node.js 运行的没有它一切都转不动。下载地址Node.js 官方下载建议建议选择 LTS长期支持版安装过程中一路Next 即可。Git (代码搬运)用于将你本地写好的博客文件“推”到 GitHub 或其他服务器上。下载地址Git 官方下载建议安装时一路 Next 即可。下载完成后的样子随便点进一个文件夹后右击空白ok前置软件都安装完成之后我们正式开始Hexo的安装。2.2Hexo的安装不论是Linux系统还是IOS还是Windows系统都有一个终端来进行命令行操作适用的指令也基本相似。如下打开我们的powershell终端必须以管理员身份运行IOS和Linux系统打开后切换root用户。打开后我们可以看一下当前我们安装的node.js和npm包管理器我们要用这个东西去网上把Hexo的安装包拉到本地的版本确定我们的确安装好了PS C:\WINDOWS\system32 node -v v24.14.0 PS C:\WINDOWS\system32 npm -v 11.9.0 PS C:\WINDOWS\system32接下来我们要用npm下载Hexo由于npm在国外它的镜像源直接下载非常的慢怎么解决呢你有VPN的可以无视接下来这一步直接开VPN然后直接下载PS C:\WINDOWS\system32\blog npm install -g hexo-cli当然不是所有人都有VPN于是方法二用国内淘宝的镜像源安装先用npm下载cnpm选择全局 -g registry指向淘宝。指令如下PS C:\WINDOWS\system32\blog npm install -g cnpm --registryhttps://registry.npm.taobao.org然后用cnpm安装PS C:\WINDOWS\system32\blog cnpm install -g hexo-cliok开始安装了。三用Hexo部署博客网站3.1创建一个文件夹来放博客资源指令PS C:\WINDOWS\system32 mkdir blog #创建文件夹blog PS C:\WINDOWS\system32 pwd #查看当前所在目录 Path C:\WINDOWS\system32 PS C:\WINDOWS\system32 cd blog #进入刚才创建的blog目录 PS C:\WINDOWS\system32\blog pwd #查看当前所在目录 Path C:\WINDOWS\system32\blog #你已经进入了博客目录 PS C:\WINDOWS\system32\blog3.2初始化一个博客指令PS C:\WINDOWS\system32\blog sudo hexo init第一个坑这一步如果是windows系统必然会报错。windows系统默认关闭sudo权限我们需要手动打开报错类型已在此计算机上禁用 Sudo。若要启用它请转到“设置”应用中的 Developer Settings page解决方法再次输入指令PS C:\WINDOWS\system32\blog sudo hexo init好的我们正式完成了初始化Windows我们可以通过图形化界面来查看输入刚才我们创建的博客的目录我的是C:\Windows\System32\blog如下也可以用指令查看PS C:\WINDOWS\system32\blog ls 目录: C:\WINDOWS\system32\blog Mode LastWriteTime Length Name ---- ------------- ------ ---- d----- 2026/4/9 19:03 .deploy_git d----- 2026/4/9 15:57 .github d----- 2026/4/9 16:53 node_modules d----- 2026/4/9 19:00 public d----- 2026/4/9 15:57 scaffolds d----- 2026/4/9 15:57 source d----- 2026/4/9 18:55 themes -a---- 2026/4/9 15:57 89 .gitignore -a---- 2026/4/9 19:03 39256 db.json -a---- 2026/4/9 16:53 349952 package-lock.json -a---- 2026/4/9 16:53 655 package.json -a---- 2026/4/9 15:57 57804 pnpm-lock.yaml -a---- 2026/4/9 15:57 0 _config.landscape.yml -a---- 2026/4/9 19:00 2675 _config.yml PS C:\WINDOWS\system32\blog3.3创建第一篇博客3.3.1看看初始化后的样子指令我在后面有总结都不用记先预览一下我们初始化后的博客长啥样输入指令PS C:\WINDOWS\system32\blog hexo s看到下面的结果里面的http://localhost:4000/**这就是初始化后的本地端口。**复制它然后再浏览器打开PS C:\WINDOWS\system32\blog hexo s INFO Validating config INFO Start processing INFO Hexo is running at http://localhost:4000/ . Press CtrlC to stop.这就是你的博客页面的初始状态3.3.2先写一篇博客ctrlc断开我们开始写文章hexo n”文章名称“创建一篇文章INFO Good bye PS C:\WINDOWS\system32\blog hexo n MyFirstBlogByHexo INFO Validating config INFO Created: C:\WINDOWS\system32\blog\source\_posts\MyFirstBlogByHexo.mdok它给我们一个目录地址C:\WINDOWS\system32\blog\source_posts\MyFirstBlogByHexo.md我们进去看看可以看到我们的文章就在里面PS C:\WINDOWS\system32\blog cd source\_posts\ PS C:\WINDOWS\system32\blog\source\_posts pwd Path ---- C:\WINDOWS\system32\blog\source\_posts PS C:\WINDOWS\system32\blog\source\_posts ls 目录: C:\WINDOWS\system32\blog\source\_posts Mode LastWriteTime Length Name ---- ------------- ------ ---- -a---- 2026/4/9 15:57 876 hello-world.md -a---- 2026/4/9 16:05 65 MyFirstBlogByHexo.md编辑它Linux和IOS使用vim编辑windows使用notepad记事本或者是code如果你下载了VScodePS C:\WINDOWS\system32\blog\source\_posts code MyFirstBlogByHexo.md在里面随便输入一段文章使用Markdown语法然后ctrls保存退出。3.3.3同步到hexo上去先回到blog目录PS C:\WINDOWS\system32\blog\source\_posts cd ../../ PS C:\WINDOWS\system32\blog pwd Path ---- C:\WINDOWS\system32\blog接下来。三步走清理生成再启动PS C:\WINDOWS\system32\blog hexo clean #清理 INFO Validating config INFO Deleted database. PS C:\WINDOWS\system32\blog hexo g #生成 INFO Validating config INFO Start processing INFO Files loaded in 145 ms INFO Generated: archives/index.html INFO Generated: index.html INFO Generated: js/script.js INFO Generated: fancybox/jquery.fancybox.min.js INFO Generated: css/style.css INFO Generated: archives/2026/04/index.html INFO Generated: js/jquery-3.6.4.min.js INFO Generated: fancybox/jquery.fancybox.min.css INFO Generated: css/images/banner.jpg INFO Generated: archives/2026/index.html INFO Generated: 2026/04/09/hello-world/index.html INFO Generated: 2026/04/09/MyFirstBlogByHexo/index.html #看到我们的文章了 INFO 12 files generated in 130 ms PS C:\WINDOWS\system32\blog hexo s #再启动 INFO Validating config INFO Start processing INFO Hexo is running at http://localhost:4000/ . Press CtrlC to stop.3.4基于github博客免费远端部署3.4.1创建一个新仓库我就默认大家都有github账号了。没有也可以注册一个非常的简单。ctrlc断开刚才的进程我们进入github官网。Github创建完成后放在那里这个仓库的名称就是你的博客网站将来的初始域名。3.4.2下载和配置Hexo插件指令如下没有VPN改成cnpm install --save hexo-deployer-gitPS C:\WINDOWS\system32\blog npm install --save hexo-deployer-git下载中npm warn ERESOLVE overriding peer dependency npm warn ERESOLVE overriding peer dependency npm warn ERESOLVE overriding peer dependency npm warn ERESOLVE overriding peer dependency npm warn deprecated lodash.get4.4.2: This package is deprecated. Use the optional chaining (?.) operator instead. npm warn deprecated superagent8.1.2: Please upgrade to superagent v10.2.2, see release notes at https://github.com/forwardemail/superagent/releases/tag/v10.2.2 - maintenance is supported by Forward Email https://forwardemail.net npm warn deprecated har-validator5.1.5: this library is no longer supported npm warn deprecated whatwg-encoding3.1.1: Use exodus/bytes instead for a more spec-conformant and faster implementation npm warn deprecated inflight1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful. npm warn deprecated humanwhocodes/object-schema2.0.3: Use eslint/object-schema instead npm warn deprecated humanwhocodes/config-array0.13.0: Use eslint/config-array instead npm warn deprecated request2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142 npm warn deprecated rimraf3.0.2: Rimraf versions prior to v4 are no longer supported npm warn deprecated glob7.2.0: Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting iizs.me npm warn deprecated cuid2.1.8: Cuid and other k-sortable and non-cryptographic ids (Ulid, ObjectId, KSUID, all UUIDs) are all insecure. Use paralleldrive/cuid2 instead. npm warn deprecated supertest6.3.4: Please upgrade to supertest v7.1.3, see release notes at https://github.com/forwardemail/supertest/releases/tag/v7.1.3 - maintenance is supported by Forward Email https://forwardemail.net npm warn deprecated moize6.1.7: This library has been deprecated in favor of micro-memoize, which as-of version 5 incorporates most of the functionality that this library offers at nearly half the size and better speed. npm warn deprecated eslint8.57.1: This version is no longer supported. Please see https://eslint.org/version-support for other options. npm warn deprecated uuid3.4.0: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details. npm warn deprecated glob8.1.0: Glob versions prior to v9 are no longer supported npm warn deprecated sinon12.0.1: 16.1.1 added 710 packages, and changed 2 packages in 40s 133 packages are looking for funding run npm fund for details下完了看看目录PS C:\WINDOWS\system32\blog ls 目录: C:\WINDOWS\system32\blog Mode LastWriteTime Length Name ---- ------------- ------ ---- d----- 2026/4/9 15:57 .github d----- 2026/4/9 16:53 node_modules d----- 2026/4/9 16:13 public d----- 2026/4/9 15:57 scaffolds d----- 2026/4/9 15:57 source d----- 2026/4/9 15:57 themes -a---- 2026/4/9 15:57 89 .gitignore -a---- 2026/4/9 16:33 35471 db.json -a---- 2026/4/9 16:53 349952 package-lock.json -a---- 2026/4/9 16:53 655 package.json -a---- 2026/4/9 15:57 57804 pnpm-lock.yaml -a---- 2026/4/9 15:57 0 _config.landscape.yml -a---- 2026/4/9 15:57 2547 _config.yml这里的_config.yml就是配置关键。指令打开这个文件。并翻到末尾。PS C:\WINDOWS\system32\blog code _config.yml如上这就是我们要配置的地方。配置如下type采用gitrepo采用你刚才的仓库名称加一个branch显式指定 master。好来到我们的第二个坑上面的这种方法再接下来的操作必然报错不论任何系统原因是Github在2021 年 8 月 13 日就已经禁止使用账号和登录密码来推送代码。强制要求使用基于令牌Token的身份验证。所以我们需要一个github的token不会弄令牌的可以跟着我的步骤来会的可以直接跳过token只显示一次必须妥善保存回到我们刚才的配置中。我们把配置改成deploy: type: git repo: https://你的token/你的仓库地址.git branch: master保存退出配置完成。3.4.3部署到远端直接输入指令PS C:\WINDOWS\system32\blog hexo d开始部署中INFO Validating config INFO Deploying: git INFO Clearing .deploy_git folder... INFO Copying files from public folder... INFO Copying files from extend dirs... warning: LF will be replaced by CRLF in 2026/04/09/MyFirstBlogByHexo/index.html. The file will have its original line endings in your working directory warning: LF will be replaced by CRLF in 2026/04/09/hello-world/index.html. The file will have its original line endings in your working directory warning: LF will be replaced by CRLF in archives/2026/04/index.html. The file will have its original line endings in your working directory warning: LF will be replaced by CRLF in archives/2026/index.html. The file will have its original line endings in your working directory warning: LF will be replaced by CRLF in archives/index.html. The file will have its original line endings in your working directory warning: LF will be replaced by CRLF in css/style.css. The file will have its original line endings in your working directory warning: LF will be replaced by CRLF in fancybox/jquery.fancybox.min.js. The file will have its original line endings in your working directory warning: LF will be replaced by CRLF in js/jquery-3.6.4.min.js. The file will have its original line endings in your working directory warning: LF will be replaced by CRLF in js/script.js. The file will have its original line endings in your working directory On branch master nothing to commit, working tree clean Enumerating objects: 29, done. Counting objects: 100% (29/29), done. Delta compression using up to 14 threads Compressing objects: 100% (21/21), done. Writing objects: 100% (29/29), 281.74 KiB | 20.12 MiB/s, done. Total 29 (delta 4), reused 0 (delta 0), pack-reused 0 remote: Resolving deltas: 100% (4/4), done. To https://github.com/ZhouBaoChuan049/ZhouBaoChuan049.github.io.git * [new branch] HEAD - master Branch master set up to track remote branch master from https://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github.com/ZhouBaoChuan049/ZhouBaoChuan049.github.io.git. INFO Deploy done: git PS C:\WINDOWS\system32\blog git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia Cloning into themes/yilia... remote: Enumerating objects: 2037, done. remote: Counting objects: 100% (1/1), done. remote: Total 2037 (delta 0), reused 0 (delta 0), pack-reused 2036 (from 1) Receiving objects: 100% (2037/2037), 10.53 MiB | 2.52 MiB/s, done. Resolving deltas: 100% (1079/1079), done.打开github我们的仓库发现里面多了很多的文件过3-4分钟把你的仓库名当成网址来用浏览器访问到为止远端部署完成。Hexo常用指令总结日常更新必备这是你每次写完新文章、修改完样式后的操作流程hexo clean (清理)清除缓存文件 (db.json) 和已生成的静态网页 (public)。建议每次部署前都运行一下防止修改没生效。hexo g (生成)全称 hexo generate。将 Markdown 源码渲染成 HTML 页面。hexo d (部署)全称 hexo deploy。将生成的网页推送到 GitHub/云服务器。创作与预览本地调试用hexo n “文章标题” (新建文章)全称 hexo new。在 source/_posts/ 下生成一个新的 .md 文件。hexo s (本地预览)全称 hexo server。启动本地服务器默认访问地址是 http://localhost:4000/。在正式发布到外网前先在本地看看排版对不对。环境与配置检查hexo v (查看版本)全称 hexo version。查看 Hexo、Node.js 及插件的版本信息遇到报错求助时很有用。hexo config (查看配置)快速查看 _config.yml 里的某个参数而不需要打开文件。好了本期内容到此结束我是此方我们下期再见。バイバイ

更多文章