静态资源必须放在 assets/ 目录下,buffalo dev 才能识别并编译;路径前缀固定为 /assets/,不可配置;修改 webpack.config.js 后需重启 buffalo dev;打包后资源固化于二进制中,仍通过 /assets/ 访问;模板中须用 r.asset() 引用资源以支持 hash。

静态资源路径必须放在 assets/ 目录下,否则 buffalo dev 不识别
Buffalo 默认只从 assets/ 目录读取并编译前端资源,不会扫描 public/、static/ 或根目录下的 CSS/JS 文件。如果你把 main.css 放在 public/css/ 里,buffalo dev 启动后访问 /css/main.css 会直接 404——它根本没加载这个路径。
正确做法是严格遵循约定:
-
assets/css/main.css→ 编译后可通过/assets/css/main.css访问 -
assets/js/app.js→ 编译后映射为/assets/js/app.js -
assets/images/logo.png→ 最终路径是/assets/images/logo.png
注意:路径前缀固定为 /assets/,不能通过配置改成 /static/ 或去掉前缀。
webpack.config.js 修改后必须重启 buffalo dev,热重载不生效
Buffalo 的 webpack 构建流程在进程启动时初始化一次,中间修改 webpack.config.js(比如加了个 DefinePlugin 或改了 output.publicPath)不会触发重新加载。你改完保存,浏览器刷新页面,资源仍走旧配置,甚至可能报 Cannot find module。
必须手动终止再重启:
- Ctrl+C 停掉当前
buffalo dev - 确认没有残留的 node 进程:
ps aux | grep webpack,必要时killall node - 重新运行
buffalo dev
常见坑:有人以为改了 assets/js/app.js 就够了,结果发现 CSS 没更新,其实是 webpack.config.js 里 mini-css-extract-plugin 的 filename 配置没同步更新,导致输出文件名不一致,HTML 引用的路径 404。
buffalo build --static 打包时,assets/ 内容被嵌入二进制,但路径不变
buffalo build 默认调用 packr 把 assets/ 下所有文件打包进最终二进制,但访问路径仍是 /assets/xxx。不需要额外配 app.ServeFiles,Buffalo 在 app.go 里已自动注册 app.Use(plugins.Static()) 处理该路径。
Buffalo框架 1.0.1 版本源码包下载,适合需要错误处理改进、依赖更新、render.Download 注释和 request logger 调整的 v1 项目。
关键点:
- 打包后删掉
assets/目录不影响运行——资源已固化在二进制里 - 若你手动注释了
app.Use(plugins.Static()),即使打包了资源,HTTP 请求也会 404 -
buffalo build --static是默认行为;加--no-static会跳过 packr,此时必须自己托管静态文件服务
验证是否成功打包:运行构建后的二进制,curl -I http://localhost:3000/assets/js/app.js,响应头应含 Content-Length 且状态码 200,而非 404。
模板中引用静态资源必须用 r.Asset,硬写路径会线上失效
Plush 模板里不能直接写 <link href="/assets/css/main.css">。开发时可能正常,但生产构建开启 hash(如 main.a1b2c3.css)后,硬编码路径就 404 了。
正确写法是用 Buffalo 提供的 helper:
<link rel="stylesheet" href="<%=%20r.Asset(" css>">
<script src="<%=%20r.Asset(" js>"></script>
r.Asset() 会自动查找构建后的真实文件名(含 hash),并返回正确 URL。它依赖 packr 在运行时解析 asset box,所以必须确保:
-
assets/已被packr打包(buffalo build默认做) - 没禁用
plugins.Static()中间件 - 没在
app.go里覆盖r渲染器实例
漏掉任意一点,r.Asset 可能返回空字符串或 panic。










