'harp compile' дает мне NameError на удивительном шрифте, используя bower

Я разрабатываю проект с использованием font-awesome и HarpJS. Я просто использую предварительно скомпилированную версию CSS font-awesome, но поскольку я использую bower, он загружает даже файлы LESS в папку с моими компонентами.

Проблема в том, что когда мне нужно скомпилировать мои ресурсы в папку dist с harp compile, это дает мне эту ошибку:

{
  "source": "Less",
  "dest": "CSS",
  "filename": "/Users/***/lib/fontawesome/less/bordered-pulled.less",
  "lineno": 4,
  "name": "NameError",
  "message": "variable @fa-css-prefix is undefined",
  "stack": "// Bordered & Pulled\n// -------------------------\n\n.@{fa-css-prefix}-border {\n  padding: .2em .25em .15em;\n  border: solid .08em @fa-border-color;\n  border-radius: .1em;\n}\n\n.pull-right { float: right; }\n.pull-left { float: left; }\n\n.@{fa-css-prefix} {\n  &.pull-left { margin-right: .3em; }\n  &.pull-right { margin-left: .3em; }\n}\n"
}

Эта ошибка происходит из-за того, что HarpJS пытается скомпилировать файлы LESS, которые поставляются с пакетом bower font-awesome. После некоторого исследования я нашел этот ответ, который указывает мне на страницу удивительной шрифтовой документации, которая гласит:

Страница: http://fontawesome.io/get-started/


Откройте свой проект font-awesome/less/variables.less или же font-awesome/scss/_variables.scss и редактировать @fa-font-path или же $fa-font-path переменная, чтобы указать на ваш каталог шрифтов.

Пример:

@fa-font-path:   "../font";

Но я не могу отредактировать ни один файл, подобный этому, так как мои зависимости установлены с помощью bower, и я не проверяю их в репозитории. Даже если я их проверю, это изменение будет отменено, как только кто-то использует bower install чтобы получить обновленную версию font-awesome.

Какой обходной путь вы бы использовали в этой ситуации?

СОВЕТ: Вы можете воспроизвести это, просто выполнив:

$ mkdir test
$ cd test
$ bower init
$ bower install --save font-awesome
$ harp compile . dist

1 ответ

Я только что провел некоторое исследование этой проблемы и считаю, что самый простой способ решить эту проблему - указать bower_components каталог.

Нашел в этом ответе способ сделать именно это:

Создайте файл.bowerrc в корне проекта с содержанием:

{
  "directory" : "_bower_components"
}

Запустите установку bower снова.

Harp не компилирует каталоги / файлы, которые начинаются с подчеркивания (_), поэтому если вы назовете каталог _bower_components, он успешно проигнорирует это.

Проблема этого подхода заключается в том, что эти файлы не будут общедоступными, поэтому вам, возможно, придется создать новый общедоступный файл, который импортирует эти файлы из font-awesome.

Что-то вроде:

@import "_bower_components/font-awesome/css/font-awesome.css"

В проблемах арфы открыт билет, где они пытаются найти способ игнорировать файлы или каталоги (аналогично.gitignore), но он еще не реализован.

Возможно, вам все равно придется выяснить, что делать с файлами шрифтов. Надеюсь, это поможет вам двигаться вперед.

Другие вопросы по тегам