Feather Webpack Plugin
Combine Feather icons into one using <symbol>
elements which you may <use>
in your markup and write the output to a file.
Uses svgstore on the back to create the <symbol>
element.
This plugin is intended to be used with html-webpack-plugin, where the template
is the output file this package produces.
Install
$ npm install --save feather-webpack-plugin
Usage
webpack.config.js
const FeatherPlugin = require('feather-webpack-plugin').default;
module.exports = {
plugins: {
new FeatherPlugin({
template: 'template.ejs',
output: 'output.ejs',
line: 1,
whitelist: [
'home'
]
})
}
};
template.ejs
<a>Before</a>
<b>After</b>
Note
The template will only be generated before Webpack runs (by using the before-run
plugin callback). Additional webpack compilations (with the --watch
flag) won't trigger the template creation script. This plugin is intended for templates ready for production, and as the Webpack config cannot be modified during runtime, there's no way for the plugin to check for config changes.
Options
new FeatherPlugin(options: object)
Name | Type | Description |
---|---|---|
template |
{String} |
The path where your template to be modified is stored. Relative to Webpack's context. |
output |
{String} |
The path where the generated template will be stored. Relative to Webpack's context. |
line |
{Integer} |
Line number where the SVG element is going to be inserted in the template file. |
whitelist |
{Array} |
Contains the names of Feather's icons you want to insert |
Additionally, all the options supported by svgstore are passed to the internal plugin instance. Take a look at their docs.