0

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.lessorを開き、 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
4

1 に答える 1