的原始文档，我已经安装了包裹，parwindcss， @tailwindcss/postcss。我的HTML标签看起来像这样：

Question

构建时。它将自动为其构建哈希，并生成像great_image.a187b2.png这样的文件。同时，与将自动更改为great_image.a187b2.png的链接不同，HTML文件的URL保持不变。在图像上引起404错误。 解决此问题的另一种方法是使用普通CS而不是尾风，就像以下：

<div class="backgroundimg">Some text...</div>
<style>
.backgroundimg {
    background-image: url(great_image.png);
}
</style>

doing，因此构建器将将链接更改为文件名上的哈希。但是，我想知道有更好的方法吗？

问题之所以出现，是因为tailwind无法自动将内线网址（

bg-[url(...)]

）自动更新为包裹生成的标签文件名。通过设计，它不扫描HTML代码，而仅在更换URL时CSS。

如果您在CSS文件中使用

@apply

使用此tailwind CSS类，则可能会起作用，因为Tailwind可以在CSS内识别

url(...)

。但是，在这一点上，如果您只坚持问题中描述的本机解决方案，那并没有太大的区别。

，您可以将图像URL存储在变量中，并在尾风CSS类中使用，例如：

Answer 1

@layer base {
  --my-image: url(great_image.png);
}

<!-- TailwindCSS v3 -->
<div class="bg-[--my-image]">...</div>

<!-- TailwindCSS v4 -->
<div class="bg-(--my-image)">...</div>