SVG files names beginning with a number cause an error in SVGO

[caesarsol]

For SVG imported like this:

import { ReactComponent as SvgIcon } from './123-abc.svg'

Webpack gives this error:

!!! Errors in compiling:

 • ./src/123-abc.svg
   TypeError: Cannot read property 'each' of undefined
       at Array.forEach (<anonymous>)
       at Array.forEach (<anonymous>)

The solution is start the SVG filename with a letter.

This is due to the SVGO plugin which has a bug prefixing CSS classes names with the filename, and CSS classes cannot begin with a number. @ilariaventurini is filing an issue (and a fix) on SVGO repo right now! Both for the non-meaningful error of numeric classes, and for the filename-prefixing code. Then we should alert the SVGR team, and then update accurapp's SVGR version.

In the meanwhile remember to rename the SVGs and maybe we should add an alert in the accurapp README.