Middleman images/fonts from bower

Question

Мне интересно, как лучше всего использовать образы & шрифты из пакетов bower с посредником. Например, я пытаюсь добавить карусель slick.js в свой проект. Это на bower и включает css, js, изображения и шрифты в коде bower.

С посредником у меня есть вещи, где я добавил каталог bower_components на путь для звездочек и компаса, поэтому файлы scss и js собираются правильно и работают нормально.

Но изображения и шрифты не попадают туда, где они будут использоваться. Библиотека slick.js использует scss и настроена на использование компасов image-url и font-url функций, если они существуют, то есть мне нужно каким-то образом получить активы из каталога bower_components, которые будут обслуживаться с того же места, что и все мои собственные изображения и шрифты, и таким образом, который работает как в режиме разработки middleman server, так и при запуске сборки.

Как это сделать?

Очевидно, что возможные решения - это просто предоставить библиотеку slick.js непосредственно в мой код или включить его из cdn, где он уже размещен, и не беспокоиться о том, что он не скомпилирован в мои одиночные файлы css и js. Любой может работать нормально, но мне интересно об общем случае, конечно, это обычный сценарий для тех, кто использует беседу и посредника.

Answer 1

Я понял, что компас предназначался для использования scss-файлов и звездочек для js, но посредник также использует звездочки (библиотека middleman-sprockets) для копирования произвольных статических активов.

Это немного ручной и многословным (если там было много больше файлов Посредник предлагает написание сценария для автоматического обнаружения их типов расширений файлов и импортировать их), но мое решение включить следующую информацию в файле config.rb:

# set local vars I'll need to access later 
images_dir = 'images' 

set :images_dir, images_dir 

# ... other config 

sprockets.import_asset('slick-carousel/slick/ajax-loader.gif') {|p| "#{images_dir}/ajax-loader.gif"} 

Answer 2

Я использую grunt, но это та же проблема. Как правило, у вас есть следующие возможности:

-Удалить то, что вам нужно в каталоге bower_components, прямо в исходное управление и ссылаться на ваши ресурсы оттуда (рекомендуется, особенно если что-то внешнее не работает, когда вы делаете сборку), или если вам не нравится выставлять bower_components в URL-адресах, создавать маршрут, который направляется в вашу папку bower_components

-Копируйте компоненты при выполнении сценария сборки/посредника по указанному пути. Ресурсов для этого варианта не будет, вы просто выбираете пункт назначения для ссылки в своем коде, а посредник копирует ваши компоненты там.