font-awesome、
未使用の
インストール、
fontmin 自体の 使い方
fontmin 自体の
フォントファイルから
fontmin には
CSS ファイルを
fontmin-webpack を 使用する 前段階で 実施する こと
fontmin-webpack
は
事前に
UnCSS の
インストール、 設定
インストール、
インストール
npm i -D fontmin-webpack
webpack.config.js の
修正
survivejs/webpack-merge: Merge designed for Webpack (MIT) を使用している 状況で、 production の ビルドのみ 適用しました。 const FontminPlugin = require('fontmin-webpack') module.exports = Merge(BaseConfig, { plugins: [ new FontminPlugin({ autodetect: true // automatically pull unicode characters from CSS }), ],
エントリーポイント index.js の
実装
bootstrap.optimized.css
、font-awesome.optimized.css
は事前に UnCSS で 未使用の CSS ファイルを 削除した ファイルです。
これで、実際に 使用している フォントのみが 抽出されます。 import '../css/normalize.css'; import '../css/bootstrap.optimized.css'; import '../css/clean-blog.css'; import '../css/codehilite.css'; import '../css/font-awesome.optimized.css'; import '../css/fonts.css'; import './jquery.js'; import './bootstrap.js'; import './clean-blog.js'; import registerServiceWorker from './registerServiceWorker.js'; registerServiceWorker(); import pageConfigurator from './pageConfigurator.js'; pageConfigurator();
未使用アイコン削除後の font ファイルの サイズ
合計 911.8 KiB が、
削除前
Asset Size Chunks Chunk Names 1dc35d25e61d819a9c357074014867ab.ttf 149 KiB [emitted] 25a32416abee198dd821b0b17a198a8f.eot 74.7 KiB [emitted] 448c34a56d699c29117adc64c43affeb.woff2 17.4 KiB [emitted] 5e173a86206ff17b10b9d500a0a5a64c.svg 335 KiB [emitted] [big] 7e2cf4cef159859a7dd1794e5173dd54.svg 91.7 KiB [emitted] c8ddf1e5e5bf3682bc7bebf30f394148.woff 88.3 KiB [emitted] e18bbf611f2a2e43afc071aa2f4e1512.ttf 43.1 KiB [emitted] e6cf7c6ec7c2d6f670ae9d762604cb0b.woff2 70 KiB [emitted] f4769f9bdb7466be65088239c12046d1.eot 19.7 KiB [emitted] fa2772327f55d8198301fdb8bcfc8158.woff 22.9 KiB [emitted]
削除後
Asset Size Chunks Chunk Names 1dc35d25e61d819a9c357074014867ab.ttf 2.85 KiB [emitted] 25a32416abee198dd821b0b17a198a8f.eot 3.04 KiB [emitted] 448c34a56d699c29117adc64c43affeb.woff2 1.11 KiB [emitted] 5e173a86206ff17b10b9d500a0a5a64c.svg 3.85 KiB [emitted] 7e2cf4cef159859a7dd1794e5173dd54.svg 2.69 KiB [emitted] c8ddf1e5e5bf3682bc7bebf30f394148.woff 2.92 KiB [emitted] e18bbf611f2a2e43afc071aa2f4e1512.ttf 2.65 KiB [emitted] e6cf7c6ec7c2d6f670ae9d762604cb0b.woff2 1.37 KiB [emitted] f4769f9bdb7466be65088239c12046d1.eot 2.96 KiB [emitted] fa2772327f55d8198301fdb8bcfc8158.woff 2.73 KiB [emitted]
参考
以下、
以上です。
コメント