JSF アプリケーションでFont Awesomeアイコンを使用しようとしています。開始手順に従い、ビューの<h:head>
セクションに以下を追加することで、ある程度の成功を収めました。
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css"
rel="stylesheet" />
icon-home
これにより、クラスを使用するときに素敵なホーム アイコンが表示されます。
ただし、Font Awesome リソースを提供するためにブートストラップ サーバーに依存したくないので、これらを war にバンドルし、バンドルされたリソースを使用するようにビューを構成しようとしています。
webjarsプロジェクトによって作成された既製のJARを使用しています。私のpomには次の依存関係があります:
<dependency>
<groupId>org.webjars</groupId>
<artifactId>font-awesome</artifactId>
<version>3.2.1</version>
</dependency>
これにより、JAR が WAR の WEB-INF/lib ディレクトリに配置されます。JAR の構造の関連部分は次のとおりです。
META-INF
- MANIFEST.MF
+ maven
- resources
- webjars
- font-awesome
- 3.2.1
- css
- font-awesome.css
- *other css files*
- font
- *font files*
プロジェクトにアイコンを含めるために、次のことを試しました。
<h:outputStylesheet library="webjars"
name="font-awesome/3.2.1/css/font-awesome.css" />
ただし、これにより、以前は機能していたホーム アイコンが次のようにレンダリングされます。
そして、私のブラウザ (Chrome) は、コンソールに次のエラーを表示します (ドメイン/ポート/コンテキストルートは、罪のないものを保護するために変更されました;):
GET http://DOMAIN:PORT/CONTEXT-ROOT/javax.faces.resource/font-awesome/3.2.1/font/fontawesome-webfont.woff?v=3.2.1 404 (Not Found)
GET http://DOMAIN:PORT/CONTEXT-ROOT/javax.faces.resource/font-awesome/3.2.1/font/fontawesome-webfont.ttf?v=3.2.1 404 (Not Found)
GET http://DOMAIN:PORT/CONTEXT-ROOT/javax.faces.resource/font-awesome/3.2.1/font/fontawesome-webfont.svg 404 (Not Found)
そのため、css ファイルは正しく解決されていますが、css ファイルが参照しているフォントを含むファイルが見つからないようです。cssファイルでこれらの参照を確認しましたが、次のとおりです。
src: url('../font/fontawesome-webfont.eot?v=3.2.1');
src: url('../font/fontawesome-webfont.eot?#iefix&v=3.2.1') format('embedded-opentype'), url('../font/fontawesome-webfont.woff?v=3.2.1') format('woff'), url('../font/fontawesome-webfont.ttf?v=3.2.1') format('truetype'), url('../font/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1') format('svg');
これらのパスは css リソースに関連しているため、JSF は問題なく見つけることができると思いました。今、私は何をすべきかわからない。
どんな指針も素晴らしいでしょう!乾杯。