Hi I have got lot of individual svg files which I want to chunk in a single file using svg-chunk-webpack-plugin.
I followed the example here and was able to do it.
It is internally taking care of adding ids to each SVGs in a sprite file based on its individual SVG fileName
Now I wanted to prefix those svg ids with my desired string and I used SVGO plugin prefixIds as mentioned here.
But webpack is not prefixing the ids with my desired string. Not sure what i am doing wrong?
I created below svgo.config.js file
export default {
multipass: true,
plugins: [
{
name: 'preset-default',
params: {
overrides: {
inlineStyles: {
onlyMatchedOnce: false
},
removeViewBox: false,
removeDoctype: false
}
}
},
{
name: 'convertStyleToAttrs' // Disabled by default since v2.1.0
},
{
name: 'prefixIds',
params: {
prefix: 'inm-icon'
}
}
]
};
And passed this to my webpack.config.js file like this under module.rules
{
test: /\.svg$/,
use: [
{
loader: SvgChunkWebpackPlugin.loader,
options: {
configFile: path.resolve(__dirname, './svgo.config.js')
},
}
]
}
I also mentioned this in module.plugins in-order to generate the sprite manifest and preview file
new SvgChunkWebpackPlugin({
filename: 'icons.svg',
generateSpritesManifest: true,
generateSpritesPreview: true
})
Everything works fine. Just that the ids in sprite file are not getting prefixed with the mentioned string. Any help on this is highly appreciated