LESS CSS background с относительным путем

У меня возникла проблема при использовании LESS в качестве таблицы стилей для моего сайта. Лично я предпочел бы использовать относительный путь в CSS, чем абсолютный путь (только моя привычка), но теперь, когда я использую LESS с функцией импорта, у меня есть проблема, как показано ниже.

У меня есть файл main.less в корневой папке

@import "inc/inc.less";

и файл inc.less в папке inc

.homeBgr {  
    background: url('icons/Home.gif');
}

изображение Home.gif находится в папке /root/inc/icons

 - main.less
      - inc
         - inc.less
         - icons
            - Home.gif

с выходом lessc

.homeBgr {  
    background: url('icons/Home.gif');
}

Однако мое ожидание

.homeBgr {  
   background: url('inc/icons/Home.gif');
}

Если я использую less.js в качестве компилятора клиента, я получил результат, как ожидалось, однако, если я использую lessc, я этого не делаю.

У кого-то была такая же проблема и есть решение для этого? Или действительно, любые предложения о том, как это сделать. Спасибо заранее.

Ответ 1

вам нужно использовать функцию unless escaping. Это будет выглядеть примерно так. firebug его или использовать chromes firebug как вещь, чтобы проверить путь, если это не работает, и вам нужно настроить его в корневую папку. вы можете хотя бы отрегулировать его после того, как он сбежал, хотя.

background: ~"url('inc/icons/Home.gif')";

Ответ 2

Вместо того, чтобы иметь main.less в корне и других меньше файлов в /inc, поместите все ваши меньше файлов в папку "css", "styles" или "less". Затем вы можете использовать последовательный относительный путь к изображениям, выполнив "../icons/home.gif"

Ответ 3

Относительный путь изображения относится к сгенерированному файлу CSS, а не к файлу LESS.