Yeoman CSS изображения путей

Question

Когда я создаю свой проект Yeoman (ничего особенного, я использую только jQuery и Modernizr), изображения, используемые с CSS, не отображаются.

Мой CSS-код

.contact {
    background:url(../icon-contact.png) no-repeat top center;
}

Вывод после сборки приложения (без разницы)

.contact {background:url(../icon-contact.png) no-repeat top center;}

Это не работает, потому что имя файла icon-contact.png изменилось на f91724e0.icon-contact.png.

Как я могу убедиться, что пути к изображениям обновлены в минимизированном CSS-файле?

---

Изменить: я добавил свое решение в качестве ответа

Answer 1

Обновление (24 февраля 2014 г.)

Вы можете исправить это, добавив <%= yeoman.dist %>/images к assetsDirs задачи usemin. См. http://www.github.com/yeoman/yeoman/issues/824.

Предыдущий ответ (4 марта 2013 г.)

Существует проблема с именем "usemin:css", которая не генерирует правильные пути к изображениям для относительных URL-адресов на GitHub по этой конкретной проблеме. Так Тран сделал ветку Yeoman и внедрил исправление.

Вот как я удалил текущую установку Yeoman и установил разветвленную версию Tak Tran:

npm uninstall yeoman -g
git clone git://github.com/taktran/yeoman.git
cd yeoman/cli
npm install -g
npm link

Источник: https://github.com/yeoman/yeoman/wiki/Additional-FAQ

С этим исправлением Yeoman переименует относительные пути к изображениям в CSS, и на мой вопрос ответят. Спасибо всем за помощь!

Answer 2

В GruntFile.js вам нужно адаптировать usemin задача, так что ссылки будут обработаны:

// update references in HTML/CSS to revved files
    usemin: {
      html: ['**/*.html'],
      css: ['**/*.css']
    },

Проверьте, есть ли у вас эта конфигурация задачи.