13

I'm using Gulp to concatenate several css files from different directories (Bower managed dependencies). Font-awesome is one of these dependencies and it contains a relative reference to its fonts url(../font....). When the css file is concatenated and placed in a different directory this relative url will obviously be wrong. Is there a best practice for dealing with this?

Improve this question
3
  • 4
    Sounds like a job for gulp-replace. Commented Feb 3, 2014 at 14:49
  • Thanks, that did the job for me. Should have figured something like that existed. Mind writing that as an answer so I can accept it? Thanks! Commented Feb 3, 2014 at 19:54
  • 2
    Could you pls explain how you solved it with gulp.replace? Commented Jul 29, 2016 at 8:04

2 Answers 2

Reset to default
7

You can use gulp-replace. https://npmjs.org/package/gulp-replace

**gulp-replace can be called with a string or regex.**

*replace(string, replacement)*

string

Type: String

The string to search for replacement

Type: String

The replacement string.

*replace(regex, replace)*

Note: gulp-replace cannot perform regex replacement on streams.

regex

Type: RegExp

You could also use gulp-frep

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

Just noticed @robertklep answer in the comments.
1

Another option is gulp-css-rebase-urls which was built to address this problem.

https://www.npmjs.com/package/gulp-css-rebase-urls

Improve this answer

1 Comment

This would be extremely useful, but unfortunately it looks like this project is no longer supported. Are there any active alternatives?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.