font-awesome と HarpJS を使用してプロジェクトを開発しています。font-awesome のコンパイル済み CSS バージョンを使用しているだけですが、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 が font-awesome の bower パッケージに付属の LESS ファイルをコンパイルしようとしているために発生しています。いくつかの調査の後、私はこの答えを見つけました。これは、次のようなフォントの素晴らしいドキュメントのページを示しています。
ページ: http://fontawesome.io/get-started/#custom-less
プロジェクトのfont-awesome/less/variables.less
orを開き、 or変数を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