如何在静态目录下使用图像作为Yesodweb中的背景？

Question

Yesod的新手，我想知道如何使用目录static / img下的图像作为div的背景图像。我使用Scaffolding网站并尝试过：

.mydiv {
  background-image: url("static/img/bg.jpg");
}

但似乎网址最后更改为http://myhost/tmp/static/img/bg.jpg。

Answer 1

也许你正在使用lucius模板，真正的css文件在运行时在临时位置/tmp自动生成并使用了相对路径。您需要的是type-safe URL，它可以在编译时验证URL的有效性。

如果您使用的是脚手架模板，那么您可以根据this

将其表示为@{StaticR img_bg_jpg}

注意：对于旧版yesod-static和模板，可能需​​要stack clean来反映静态目录中的更改。