Node.js内の複数のSVGグラフィックからSVGフォントを生成

Question

私はNode.jsアプリケーションを作成して、SVGアイコンの束をカスタムWebフォントアイコンセットに結合することができます。私が見つけた唯一の類似プロジェクトはthis siteですが面白そうですがかなりバグです。

最終的に私は、このアプリケーションがベストプラクティスを使用してページ上にこれらのアイコンを使用するためにさまざまなクロスブラウザフォントファイルとCSSを出力したいと考えています。 SVGアイコンフレームワークを作成することが目標です。

しかし私が働きたいのは、複数のSVGアイコンをSVGフォントファイルに結合することです。上記のサイトがそれを行っている場合は可能である必要がありますが、私は良い情報を見つけるのが難しいです。

誰かが正しい方向に向いていますか？ありがとう！

編集：this service私はフォントをホストしたくはありませんが、私のサービスは無料（そしておそらくオープンソースでもあります）したいと思っていますが、私の目標とよく似ています。

Answer 1

私の大きなアイデアの多くと同様に、誰かが最初にそれを考えた:)

この渡って来るかもしれない人にとって、Keyamoon's font generator toolをチェックしてください。

Answer 2

後半の種類が、誰がそれを必要とするならば、私はこれがそうなると思います。それは同様にあなたのための優れたリソースであるかもしれないので、https://github.com/sapegin/grunt-webfont

Answer 3

Glyphter.comは、マルチパス・アイコンを処理します。

Answer 4

複数のSVGを1つのシンボルコレクションに結合する場合は、svg-joinを試してみてください。

このツールは2つのファイルを作成します。 最初は "SVG-bundle.svg" です：

<svg ...> 
    <symbol id="svg1" ...> 
    <symbol id="svg2" ...> 
</svg> 

すべての記号は、あなたの独立したSVGファイルです。

.svg_svg1, 
.svg_svg2 { 
    width: 20px; // for example 
    height: 20px; 
} 

は今、あなたはあなたのhtmlでそれを使用する可能性があります：あなたは、物事を自動化したい場合は

<link rel="stylesheet" type="text/css" href="svg-bundle.css" /> 
... 
<svg class="svg_svg1"><use xlink:href="svg-bundle.svg#svg1"></svg> 
<svg class="svg_svg2"><use xlink:href="svg-bundle.svg#svg2"></svg> 

Answer 5

NPMパッケージがある

最後のものは、 "SVG-bundle.css" でありますsvg-font-createと呼ばれます。