postcss / postcss-url

PostCSS plugin to rebase url(), inline or copy asset.
MIT License
377 stars 59 forks source link

optimizeSvgEncode unclosed string #105

Closed gpoitch closed 7 years ago

gpoitch commented 7 years ago

Thanks for the optimizeSvgEncode feature.

It appears to be creating invalid css: Module build failed: Unclosed string

background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3e%3cpath d='M0 4v24h32V4H0zm6 22H2v-4h4v4zm0-8H2v-4h4v4zm0-8H2V6h4v4zm18 16H8V6h16v20zm6 0h-4v-4h4v4zm0-8h-4v-4h4v4zm0-8h-4V6h4v4zm-18 0v12l8-6z'/%3e%3c/svg%3e);

Look like it's because Inlining inserts without wrapping the whole thing in quotes and there are now unencoded quotes in the svg when using optimizeSvgEncode

gpoitch commented 7 years ago

Looks like this retains the input css's quoting, so this works ok:

.style {
  background-image: url("./image.svg");
}

But this fails:

.style {
  background-image: url(./image.svg);
}

Quotes on file path urls are optional according to the css spec, but maybe this module should enforce adding quotes when inlining.

sergcen commented 7 years ago

@gdub22 thanks for feedback. Yes, you're right. I will try fix it soon.

Realetive commented 7 years ago

replace https://github.com/postcss/postcss-url/blob/master/src/type/inline.js#L81 on

return `'${(options.includeUriFragment && asset.hash) ? encodedStr + asset.hash : encodedStr}'`;

work for me.

sergcen commented 7 years ago

fixed here #7.1.1

gpoitch commented 7 years ago

Thank you. Confirmed it's working.