NaN for path d without spaces

[strarsis]

The plugin would inline path components incorrectly (values as NaN) when the path components are not separated by spaces, however, path components not separated by space seem to be valid SVG and also render correctly in a browser like Chrome:

Input (renders correctly in browser):

<path d="M276.82 222.21a53.706 53.706 0 00-1.88-9.945l-.076-.301v.006c-.019-.057-.03-.115-.047-.176-10.521 35.277-56.797 62.66-114.39 66.896V145.47l48.846-3.389c2.03 2.754 5.287 4.551 8.973 4.551 6.156 0 11.146-4.99 11.146-11.146 0-6.159-4.99-11.147-11.146-11.147a11.132 11.132 0 00-9.333 5.061l-48.485-3.908v-19.033c14.332-6.023 24.398-20.193 24.398-36.715 0-21.986-17.826-39.809-39.812-39.809-21.987 0-39.811 17.822-39.811 39.809 0 16.521 10.064 30.691 24.398 36.715v19.033L81.093 129.4a11.127 11.127 0 00-9.332-5.061c-6.156 0-11.147 4.988-11.147 11.147 0 6.156 4.991 11.146 11.147 11.146 3.685 0 6.943-1.797 8.972-4.551l48.868 3.389v133.24c-57.748-4.152-104.18-31.576-114.72-66.92a53.859 53.859 0 00-2.062 10.936c-2.109 14.559-3.589 40.879 8.662 59.762-.804-6.746-.376-15.34 4.196-19.537 10.196 13.244 25.848 24.533 45.149 32.709.322.139.655.264.979.4v.068c.423.146.824.291 1.243.438a162.992 162.992 0 0010.389 3.816c50.106 19.688 61.409 43.59 61.409 43.59l.003-.572v.572s11.336-23.984 61.664-43.693a161.386 161.386 0 009.861-3.617c.512-.176.999-.357 1.518-.533v-.076c19.745-8.207 35.776-19.639 46.142-33.102 4.574 4.193 5.003 12.787 4.2 19.537 12.405-19.114 10.735-45.839 8.585-60.282zM145.02 49.85c10.988 0 19.895 8.91 19.895 19.896 0 10.988-8.906 19.896-19.895 19.896-10.987 0-19.896-8.907-19.896-19.896 0-10.986 8.908-19.896 19.896-19.896z"/>

Output (doesn't render correctly in browser as of obvious reasons):

<path d='M276.82 222.21a53.706 53.706 0 0-1.88-9.945 NaNl7.989 NaNvNaNc-.019 NaN-.03 NaN-.047 NaN-10.521 NaN-56.797 NaN-114.39 NaNvNaNl48.846 NaNc2.03 NaN 5.287 NaN 8.973 NaN 6.156 NaN 11.146 NaN 11.146 NaN 0 NaN-4.99 NaN-11.146 NaNa11.132 11.132 0 0-9.333 5.061 NaNl-62.879 NaNvNaNc14.332 NaN 24.398 NaN 24.398 NaN 0 NaN-17.826 NaN-39.812 NaN-21.987 NaN-39.811 NaN-39.811 NaN 0 NaN 10.064 NaN 24.398 NaNvNaNL81.093 NaNa11.127 11.127 0 0-9.332-5.061 NaNC61.334 NaN 56.343 NaN 56.343 NaNc0 NaN 4.991 NaN 11.147 NaN 3.685 NaN 6.943 NaN 8.972 NaNl48.868 NaNvNaNC71.853 NaN 25.421 NaN 14.881 NaNa53.859 53.859 0 0-2.062 10.936 NaNC-2.288 NaN-3.768 NaN 8.483 NaNc-.804 NaN-.376 NaN 4.196 NaN 10.196 NaN 25.848 NaN 45.149 NaN.322 NaN.655 NaN.979 NaNvNaNc.423 NaN.824 NaN 1.243 NaNa162.992 162.992 0 10.389 3.816 NaN NaNcNaN NaN NaN NaN NaN NaNlNaN NaNvNaNsNaN NaN NaN NaNa161.386 161.386 0 9.861-3.617 NaN NaNcNaN NaN NaN NaN NaN NaNvNaNcNaN NaN NaN NaN NaN NaN NaN NaN NaN NaN NaN NaN NaN NaN NaN NaN NaN NaNzM145.02 49.85c10.988 0 19.895 8.91 19.895 19.896 0 10.988-8.906 19.896-19.895 19.896-10.987 0-19.896-8.907-19.896-19.896 0-10.986 8.908-19.896 19.896-19.896z'/>

[tedw]

Anyone figure out a fix for this?

[strarsis]

@tedw: Apparently there are different ways for exporting this from Illustrator. Or run it through svgo first and hope it fixes these coordinates (there was a related bug in svgo that has been fixed now).

[tedw]

@strarsis Ah ok, was hoping there was a way to fix in PostCSS. Will try tweaking the SVGO config, perhaps it’s related to “convertPathData” for my particular SVG. Thanks!

[tedw]

Turns out it was due to an outdated version of svgo in this framework I’m using.

https://discourse.roots.io/t/fix-yarn-build-production-webpack-config-optimize-js-and-corrupted-svgs/18128/3?u=tedw

[TrySound]

So this is the problem of svgo, right?

[tedw]

@TrySound Yup, can close 👍

FWIW, in my case it was an old version of css-loader that was loading an old version of svgo (https://github.com/svg/svgo/issues/990#issuecomment-570012473)