2017-11-03 20 views
0

ウェブパックプロジェクトにどのようにフォントを追加しますか?私はダースのWebpackガイドを見てもフォントを追加するための実際の解決策がまだ見つからないとは思えません。私はここで見つけることができ定型を使用しています、リアクト使用していない:https://github.com/sandrina-p/essential-webpack-boilerplatewebpackビルドにフォントを追加するには?

フォルダ構造は以下の通りである:

src 
|-fonts 
|-scripts 
|-styles 
index.thml 

私は私の設定ファイルに以下を追加しました:

{ 
    test: /\.(eot|svg|ttf|woff|woff2)$/, 
    loader: 'file-loader?name=/fonts/[name].[ext]' 
}, 

私はそうのように私のCSSでフォントファミリをインポートしています:

@font-face { 
    font-family: 'MPR' !important; 
    src: url('/styles/MPR.ttf') format('ttf'), 
} 



h2 { 
    font-family: 'MPR'; 
} 

私はh2タグはフォントを表示せず、デフォルトでは新しいローマ字に変更されます。どんな洞察力があれば大いに感謝されます、私は実際に私がフォントを使うことができるように、私のプロジェクト全体を再構築する必要はありません。

答えて

1
+0

はい、それはそれの一部であったため、絶対パスを相対パスを追加していないする必要があります。私は私のフォントを定義し、それを私のメインのjsファイルにインポートしたCSSファイルを作成した場合、それがうまくいくことが分かりました。そして、はい、私は私の道を変えなければなりませんでした。 – figaro

関連する問題