hexo生成静态文件,xampp仅托管public目录;不能直接放整个hexo项目进htdocs,因其不支持node.js及源码结构;需配置url和root、启用mod_rewrite并设置.htaccess以解决路径与404问题。

Hexo 生成的是纯静态文件,XAMPP 本身不参与 Hexo 构建过程,只负责托管 public 目录下的 HTML/CSS/JS 文件;直接把 public 整个目录丢进 htdocs 就能访问,但默认端口、路径和权限问题会卡住很多人。
为什么不能直接把 hexo init 的整个项目扔进 htdocs
因为 XAMPP 的 Apache 只服务静态资源,不执行 Node.js 环境,也不识别 _config.yml、source/、scaffolds/ 这些 Hexo 源码结构。它只认编译后的输出——也就是运行 hexo generate(或 hexo g)后生成的 public/ 文件夹内容。
常见错误现象:
- 浏览器打开
http://localhost/显示“Index of /”,而不是博客首页 - 点进某个文章链接变成 404,因为 Apache 默认不支持 Hexo 的伪静态路径(如
/posts/hello-world/) - CSS/JS 路径错乱,页面白屏或样式丢失
根本原因:Hexo 默认生成的相对路径假设部署在根域名下(如 https://example.com/),而你若把 public 放在 htdocs/blog/ 子目录,所有资源引用就全偏了。
必须改的两个配置项:url 和 root
在 Hexo 项目根目录的 _config.yml 中,这两个字段决定生成文件里所有链接和资源的前缀,不改它们,本地预览正常,一放进 XAMPP 就崩。
假设你想通过 http://localhost/blog/ 访问博客,那么:
-
url:必须设为http://localhost/blog(结尾不加斜杠) -
root:必须设为/blog/(开头和结尾都带斜杠)
改完保存,再执行:
npx hexo clean && npx hexo generate
此时 public/ 下所有 HTML 里的 <link>、<script></script>、文章链接都会带上 /blog/ 前缀,Apache 才能正确定位资源。
XAMPP 8.0.30 是一款免费、开源的跨平台 Web 服务器集成包,专为快速搭建本地 PHP 开发环境而设计。该版本核心组件包括:Apache 2.4.56、MySQL 8.0.33、PHP 8.0.30、phpMyAdmin 5.2.1 等。它支持 Windows、Linux 和 macOS 系统,可让开发者在个人电脑上轻松模拟服务器环境,无需复杂配置即可运行 WordPress、Thin
Apache 不支持 /post/name/ 这种路径?加一个 .htaccess
Hexo 默认用目录形式生成文章页(比如 public/posts/my-post/index.html),对应 URL 是 /posts/my-post/。但 Apache 默认不会自动找子目录下的 index.html,除非开启 DirectoryIndex 并配置重写规则。
在 XAMPP 的 htdocs/blog/(即你放 public 内容的地方)下新建一个 .htaccess 文件,内容如下:
DirectoryIndex index.html RewriteEngine On RewriteBase /blog/ RewriteRule ^(.*)/$ /blog/$1/index.html [L]
注意:RewriteBase 必须和你的 root: 配置一致(这里是 /blog/)。如果放在 htdocs/ 根目录,就写 RewriteBase /。
还要确认 XAMPP 的 Apache 已启用 mod_rewrite:打开 apache/conf/httpd.conf,取消这行的注释:
LoadModule rewrite_module modules/mod_rewrite.so
Windows 下 XAMPP 启动失败或端口被占?别硬刚 4000
Hexo 自带的 hexo server 默认用 4000 端口,但 XAMPP 的 Apache 默认用 80 或 443。这两者完全无关,别混淆。
你只需要关心 Apache 是否跑起来:
- 启动 XAMPP Control Panel,确保
Apache显示Running - 如果启动失败,大概率是 80 端口被 IIS、Skype 或其他服务占用;改 Apache 端口更稳妥:编辑
apache/conf/httpd.conf,找到Listen 80改成Listen 8080,再改ServerName localhost:80为ServerName localhost:8080 - 改完重启 Apache,然后访问
http://localhost:8080/blog/
最后提醒一句:每次改完 Hexo 源文件(比如写新文章),都要重新执行 npx hexo generate,再刷新浏览器——XAMPP 不会自动监听源码变化。










