Best way to rewrite urls in css files before production launch?

The project i'm currently working on has seen various coders, from various backgrounds. After succesfully writing a clean Capistrano recipe in order minimize css and js files, I'm asking myself how to recognize various url patterns spread around our css codebase, to rewrite them all at once before they go live. The patterns i'm looking for are

url('../../images/
url(../images/
url("../../../images/
url(images/

So basically, here's an input example :

.test{background:url('/images/test.jpg') no-repeat top left}.pouet{background:url("../../images/bg.png")}

Note that in some cases, we have quotes, in others not... And what i'm trying to obtain

.test{background:url('http://www.cdnImages.com/images/test.jpg') no-repeat top left}.pouet{background:url("http://www.cdnImages.com/images/bg.png")}

All these must be replaced by my cdn url. The most puzzling thing is how to do so in a way that does not allow any mistakes.

I've come up with a regexp that fits my needs : rubular permalink

I was looking at the sed command, using it as follows

sed '/url([^\/](.*?)images/http:\/\/www.cdnImages.com' myFile.css

but that doesn't seem to do the job.

My current research lead me to this

 find #{current_release}/public/static/css/ -name '*.css' | xargs sed -i 's@url\([^\/](.*?)images|static\/@#{images_cdn}@g'

and, while开发者_高级运维 the regular expression perfectly fits the need (check here to see the catched output, there seems to be something wrong somewhere.

Any idea ? Thanks a lot.

---

Here's my test case

printf ".test{background:url('/images/test.jpg') no-repeat top left}.pouet{background:url(\"../../images/bg.png\")}\n" \
| sed 's@url[(][^)][^)]*)@url(http://www.cdnImages.com)@g'

.test{background:url(http://www.cdnImages.com) no-repeat top left}.pouet{background:url(http://www.cdnImages.com)}

Ah.. one more thing

printf ".test{background:url('/images/test.jpg') no-repeat top left}.pouet{background:url(\"../../images/bg.png\")}\n" \
| sed 's@url[(][^)][^)]*)@url('"'"'http://www.cdnImages.com'"'"')@g'

.test{background:url('http://www.cdnImages.com') no-repeat top left}.pouet{background:url('http://www.cdnImages.com')}

Note that with some sed's you need to escape the first '@' sign like \@.

I see your example output keeps the respective '...' and "..." quote chars that were there. I hope it is OK to change all to '...'. If not, that makes the problem more complicated.

As you say this is a production push and '... do so in a way that does not allow any mistakes.', you will need to test the heck of out of this.

To elevate your sed usage, thing about what is happening with search pattern @url[(][^)][^)]*)@.

To elevate your shell usage, thing about what/why I changed to '"'"'http://www.cdnImages.com'"'"', in the final round. ;-)

I'm out of time right now.

I hope this helps.

---

I don't know why people are complicating it, it's pretty simple. I do this kind of thing all the time.

data=$(cat <<EOF
.test{background:url('/images/test.jpg') no-repeat top left}.pouet{background:url("../../images/bg.png")}
EOF
)
prefix="http://www.cdnImages.com/"
rule=$(cat <<EOF
s|/*\(\.\./\)*\(images/[^'"]*\)|$prefix\2|g
EOF
)

echo "$data" | sed "$rule"

Take note of the escaping of the \' and "$prefix".

---

I finally came up with the perfect command, that fits the need :

run "find #{current_release}/public/static/css/ -name '*.css' -print0 | xargs -0 sed -i -E 's@(\.\.\/)+(images|static|img)@#{images_cdn}@g'"

works fast and safe !