Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Already on GitHub? Sign in to your account

yeoman build not updating revved image references in css #643

Closed
reneruiz opened this Issue Oct 16, 2012 · 9 comments

Comments

Projects
None yet

This is what my Gruntfile.js file reads: https://gist.github.com/3901723

I'm new to this so I'm not sure what the ** means. But it's rewriting the references in the HTML file, but not any of my CSS files under app/styles/.

UpWorks commented Oct 22, 2012

+1 v.0.9.4

Reports Build Success
Done, without errors.

@renerulz - are you using relative or absolute paths for your css images? In addition are you using compass?

kroofy commented Oct 24, 2012

I think this may be a duplicate of #419

Here's what I did to reproduce it (init with all the defaults, using Compass)

yeoman init

add this to main.scss

body {
  background: url(../images/glyphicons-halflings.png);
}

Everything looks fine (i.e. you get the icon background) when running yeoman server

But if you try to view the index page after running the build command the CSS will not have updated its path to the new revved image.

julrich commented Oct 26, 2012

Not entirely sure if the problem is related, but we have a configuration which outputs relative paths for images in css-files, which is how we want it to work.

So the resulting css (after compass) has css like this:

background: url('../images/image.png');

The check in https://github.com/yeoman/yeoman/blob/master/cli/tasks/usemin.js#L385 will not be true for those, because it checks 'images' (where the image is found when expanding *_/_image.png) against '../images', and thus not replace the url.

Is it just not meant to be used with relative urls in css?

Fixed it for our use-case, but the fix is kinda ugly and will probably only work for our (local) configuration:

var filepath = filepaths.filter(function(f) { return dirname === path.dirname(f) || dirname === '../'+path.dirname(f));})[0];

same here

was used to relative file path in css files so would welcome a fix

brodkin commented Nov 22, 2012

I have found that using an absolute URL will fix this, but I still have an issue with image paths specified in javascript files.

sleeper added a commit that referenced this issue Dec 3, 2012

Merge pull request #702 from Roparz/master
Try to fix issue #643 "yeoman build not updating revved image references in css"

Nice, but this does not work yet for bundled fonts, though:

#419

suvash commented Dec 30, 2012

Can somebody confirm if this issue is fixed ? On 0.9.6 here, still seems to be the case.

I'm using bootstrap css, while the images are being rev-ved properly, the css files aren't updated accordingly.

I too am still having the same problem even after updating to 0.9.6... not sure when it was introduced, 0.9.4 or earlier, as it used to work fine, but hasn't for awhile now (I've been going in and manually updating the image references in the CSS on every build, which is rather a pain!)

Contributor

sleeper commented Dec 31, 2012

v0.9.6 is almost the same as v0.9.5 (only the updater is disabled).
The commit which is supposed to fix this issue is way more recent than 0.9.5.

You could try to use yeoman from this version (e.g. clone, checkout the needed version and install locally).

sleeper added a commit that referenced this issue Apr 24, 2015

Merge pull request #702 from Roparz/master
Try to fix issue #643 "yeoman build not updating revved image references in css"
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment