Fontello Plugin for Webpack 5

Download icon fonts to webpack build folder using Fontello.

Install

npm install fontello-webpack5-plugin html-webpack-plugin

Usage

/webpack.config.js

const HTMLWebpackPlugin = require("html-webpack-plugin");
const FontelloPlugin = require("fontello-webpack5-plugin");

module.exports = {
  entry: "index.js",
  /* ... */
  plugins: [
    new FontelloPlugin({
      config: require("./fontello.config.json")
      /* ...options */
    }), 
    new HTMLWebpackPlugin({
      // The plugin is required for FontelloPlugin, but if you want to suppress its output, uncomment the line below. 
      // "filename": "/dev/null",
    }),

  ]
}

Options

new FontelloPlugin(options: Object)

|Name|Type|Default|Description| |----|----|-------|-----------| |config|Object|-|Configuration generated by Fontello.com. |className|String|""|Base class name. Use this if your configuration doesn't have a prefix.1 |fonts|Array|[ "eot", "woff", "woff2", "ttf", "svg" ]|Font types supported. |name|String|"icons"|Module name. |output.css|String|"[name].css"|Css output path |output.font|String|"font/[name].[ext]"|Fonts output path |proxy|String|null|Proxy URL if you sit behind an http or https proxy, e.g. http://1.2.3.4:8080|

1 When config.css_prefix_text is empty a base class name is required to target all icons in css. If no prefix or class name is provided base styles are not emitted.