boopathi/react-svg-loader

Webpack compilation failed after upgrade to v3

alxmiron opened this issue · 2 comments

alxmiron commented

I recently upgraded from v2.1.0 to v3.0.1. Now have an error during webpack build with all imported svg files.

ERROR in ./packages/resources/icons/hi-archive.svg
Module build failed (from ./node_modules/react-svg-loader/lib/loader.js):
TypeError: Property value expected type of string but got null

Content of hi-archive.svg is quite simple:

<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <path fill-rule="evenodd" d="M1,0 L15,0 C15.5522847,-1.01453063e-16 16,0.44771525 16,1 L16,15 C16,15.5522847 15.5522847,16 15,16 L1,16 C0.44771525,16 6.76353751e-17,15.5522847 0,15 L0,1 C-6.76353751e-17,0.44771525 0.44771525,1.01453063e-16 1,0 Z M2,1 C1.44771525,1 1,1.44771525 1,2 L1,14 C1,14.5522847 1.44771525,15 2,15 L14,15 C14.5522847,15 15,14.5522847 15,14 L15,2 C15,1.44771525 14.5522847,1 14,1 L2,1 Z"></path>
    <path fill-rule="evenodd" d="M10,12 L10,9.5 C10,9.22385763 10.2238576,9 10.5,9 L15.5,9 C15.7761424,9 16,9.22385763 16,9.5 C16,9.77614237 15.7761424,10 15.5,10 L11,10 L11,12.5 C11,12.7761424 10.7761424,13 10.5,13 L5.5,13 C5.22385763,13 5,12.7761424 5,12.5 L5,10 L0.5,10 C0.223857625,10 3.38176876e-17,9.77614237 0,9.5 C-3.38176876e-17,9.22385763 0.223857625,9 0.5,9 L5.5,9 C5.77614237,9 6,9.22385763 6,9.5 L6,12 L10,12 Z"></path>
    <path fill-rule="evenodd" d="M7.5006594,6.80722153 L11.3212804,2.85085263 C11.513105,2.65221243 11.8296393,2.6466873 12.0282795,2.83851192 C12.2269197,3.03033653 12.2324448,3.3468708 12.0406202,3.545511 L7.87267001,7.8615498 C7.6808454,8.06019 7.36431113,8.06571513 7.16567093,7.87389052 L5.00765153,5.78991541 C4.80901132,5.59809079 4.8034862,5.28155652 4.99531081,5.08291632 C5.18713542,4.88427612 5.5036697,4.87875099 5.7023099,5.07057561 L7.5006594,6.80722153 Z"></path>
</svg>

My current loader config:

webpackConfig.module.rules.push({
	test: /\.svg$/,
	exclude: /node_modules/,
	use: [
		{
			loader: 'babel-loader',
			options: {
				cacheDirectory: true,
			},
		},
		{
			loader: 'react-svg-loader',
			options: {
				jsx: true,
				cacheDirectory: true,
				svgo: {
					plugins: [{ cleanupIDs: false }],
					floatPrecision: 2,
				},
			},
		},
	],
});
alxmiron commented

@boopathi please make attention here

alxmiron commented

The error has gone in v3.0.3