skillup

技術ブログ

JavaScript

font-awesomeのインストール(タスクランナー経由)

投稿日:2017年12月17日 更新日:

fontawesomeをタスクランナー経由でインストールすることについて。

CDNでインストールするだけならURL張り付けるだけですが。

インストール

まずnpmで下記コマンドでインストールをします。

webpack.mix.js

lessを例に出してますが、sassでももちろん問題ありません。

あとはHTML側でfontawesomeのタグを入れます。

チェック点

  • 画面を読み込んだとき、CSSがよみこまれているか
  • Fontの画像データ(eot,svg,ttfなど)がよみこまされているか

画像データはディレクトリにあるのに読み込まれないときはapacheやnginxなどの画像サーバーで読み込まされているかの確認もしておきましょう。
参考リンク

【保存版】Font Awesomeの使い方:Webアイコンフォントを使おう

Font Awesomeをwebpackに読み込んでくれるnpmパッケージ

Font Awesomeの使い方が初心者でもわかる!ダウンロードから設定方法まで

-JavaScript
-, ,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

jQuery子要素の取得方法など

jQueryで要素を取得する方法って$(“セレクタ”)しか知らなかったんですが、他にもいろいろあることがわかったのでちょっと紹介。 例えばtrの列の中に横1列に<inpu …

no image

JavaScriptのタイマー

えーボタンを押すと、時間の計測がはじまり、別のボタンを押すとそのタイマーがとまるというもの。 WEBのアプリでは比較的よくお目にかかるタイプかと思います。 一番多いのは情報商材のページかもしれないです …

no image

JSF+ajax

JSFでajaxを使うときにいろいろと調べたのでメモ。 やろうとしたことはWEB上で給与明細の計算をしたくて、プルダウンで月の変更したら自動的に経費が該当月に替わるというシステムです。 ajaxを使う …

no image

package.jsonによるタスクの実行

前回の記事でgulpによるタスクの実行を書きましたが、package.jsonでこれを行うこともできます。 てっきり依存ライブラリの記述だけかと思いますしたが、様々なタスクを実行できるようですね。イメ …

no image

Angular概論 モジュール、コントローラー、スコープなど

Contents1 Angularインストール2 ソース2.1 モジュール、スコープとコントローラ2.1.1  モジュールとは2.1.2 コントローラーとは2.1.3 スコープとは3 参考リンク An …