如果使用grails asset-pipeline插件，如何处理css中的图像位置？

Question

jquery.flipcountdown.css文件是：

.xdsoft_flipcountdown.xdsoft_size_lg >.xdsoft_digit{
width:53px; 
height:76px;
background-image:url(./img/digit-lg.png);
}

目录结构是

+flipcountdown-master
 + img
   - digit-lg.png
 - jquery.flipcountdown.css

问题是：在这种情况下如何使用资产管道。

1：将css放在assets / stylesheets下，并将img文件夹放在assets / images文件夹下？可以吗？

2：将css文件和img文件夹全部放到assets / stylesheets文件夹中，我很确定它可以工作，但资产管道可以gzip吗？

我不擅长js / css，我花了很多时间在Youtube上阅读Asset-Pipeline文档和视频，但我仍然不知道如何以正确的方式使用它。

事先提前

Answer 1

您可以在此处执行以下操作：

如果要利用资产管道插件提供的组织结构，请将.css文件放在assets / stylesheets目录中，将图像放在assets / images目录中，并将./img/digit-lg.png的所有引用更改为{{ 1}}（您也可以指定digit-lg.png或/assets/digit-lg.png并获得相同的结果）。这是目录结构的样子：

/assets/images/digit-lg.png

grails资产管道在解析资产时会忽略顶级图像，javascripts和样式表文件夹，因为它们纯粹是出于组织目的。

或者，由于这是第三方样式表，因此最好保持├── assets │   ├── images │   │   ├── digit-lg.png │   ├── javascripts │   └── stylesheets │   └── jquery.flipcountdown.css 文件不被修改，并保持自包含。您只需将.css目录添加到flipcountdown-master目录或assets/，将css background-image网址设置为assets/stylesheets/，一切都可以正常工作。这是这种情况下的结构：

./img/digit-lg.png

资产管道非常灵活，但您觉得组织资产最为舒适，不仅有一种方法可以做。管道选择的任何文件都有资格进行gzip压缩。

Answer 2

Here is the sample app

特别要查看包含外部库的application.js和application.css。

只需从github，run-app克隆应用程序，然后点击索引页面即可。您应该在索引页面中看到倒计时时钟。