Problem with digested assets called via url() in css

[abi...@ozzla.com]

Hello,

I just got asset fingerprinting working. I'm using play 2.5.13/sbt-digest 1.1.1/font-awesome 4.7.0

This works all good and fine while using routes.Assets.versioned, but i have 3 assets where it doesn't work/pull the digested version.

These seem to be related to url() calls from inside css files.

The first two are font calls. I'll show the font-awesome one here because it should be straightforward, since i'm using the module. It's called from inside the font-awesome css file.

/assets/lib/font-awesome/fonts/fontawesome-webfont.woff2?v=4.7.0

called from

/assets/lib/font-awesome/css/269550530cc127b6aa5a35925a7de6ce-font-awesome.min.css

Relevant line is:

     url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2')

I have the digested versions for the font in both my web server and app assets jar

     ls assets/lib/font-awesome/fonts/*fontawesome-webfont.woff2*
     assets/lib/font-awesome/fonts/af7ae505a9eed503f8b8e6982036873e-fontawesome-webfont.woff2
     assets/lib/font-awesome/fonts/fontawesome-webfont.woff2.md5

     jar -tf *assets.jar | grep fontawesome-webfont.woff2
     public/lib/font-awesome/fonts/fontawesome-webfont.woff2.md5
     public/lib/font-awesome/fonts/af7ae505a9eed503f8b8e6982036873e-fontawesome-webfont.woff2

The last is a css file called from one my bootstrap theme's css files.

/assets/stylesheets/niceAdmin/line-icons.css

called from

/assets/stylesheets/niceAdmin/6e7f7468288f6c306b0f30bfbce3ce7f-style.css

Relevant line is:

     @import url(line-icons.css);

Does url() processing not go through the digest pipeline or am I missing something else?

Thanks,

-Tony

[Dominik Dorn]

Hi Tony,

unfortunately, there is no built-in mechanism in play that would
rewrite your css/javascript-files and replace urls with their digested version. 

the only thing that sbt-digest does is renaming the files and creating the corresponding md5 files,

so that the asset controller and its reverse routing can find the right version and put the

correct URL into your scala templates. 

If you're using sass/scss/less, rename the included file to sass/scss/less .. that way the include will
really include the file into the css file and you will not have to handle any rewriting. 
alternatively you can reference the css file directly in your scala templates, that way play would take care

of using the correct url. 

the third alternative you have is to create a custom processor, that looks through your css files and replaces

occurrences of filenames with their digested equivalent... this probably is the hardest route to go. 

hope that clarifies things a little.

cheers,

dominik

[abi...@ozzla.com]

On Saturday, April 15, 2017 at 11:48:55 AM UTC-6, Dominik Dorn wrote:

If you're using sass/scss/less, rename the included file to sass/scss/less .. that way the include will
really include the file into the css file and you will not have to handle any rewriting. 
alternatively you can reference the css file directly in your scala templates, that way play would take care

of using the correct url. 

Thanks for the response Dominik.

So, if i'm understanding you correctly, in the theme on i mentioned, i should take my style.css file that's doing the @import url() and change it to style.scss.

I did this and it did compile into the digested style.css. Inside that it's still referencing "@import url(line-icons.css)" and when the style css is called it still calls the non-digested version of line-icons.css

I did notice in the digested style css it now has a commented map at the bottom that says:

/*# sourceMappingURL=style.css.map */

and when it calls it it pulls that and not the digested version from apache

Keep in mind i'm a beginner and handle the admin side of things, but am trying to help out on the dev side. So, sorry if i sound stupid :)

-Tony