Force Webpack to use
file-loader instead of
url-loader for fonts, images and media rules. The motivation behind this plugin is because when using
typeface-* modules to embed fonts in an app, some font styles are embedded in CSS as base64 strings even if they are not being used.
$ npm install gatsby-plugin-force-file-loader
By default, all rules are enabled. To conform with the best practices, it's recommended that you set only the rules that you need, keeping the default behavior in other rules.
Note: for better compatibility, use this plugin before any other plugin.
// gatsby-config.jsmoduleexports =plugins:resolve: `gatsby-plugin-force-file-loader`options:rules:'fonts' /* Matches Gatsby default rules for fonts */'images' /* Matches Gatsby default rules for images */'media' /* Matches Gatsby default rules for media (video/audio) *//* ... */