Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

image-set with image in base64 format cause error #8028

Closed
7 tasks done
maoxiaoke opened this issue May 5, 2022 · 1 comment
Closed
7 tasks done

image-set with image in base64 format cause error #8028

maoxiaoke opened this issue May 5, 2022 · 1 comment
Labels
feat: css regression The issue only appears after a new release

Comments

@maoxiaoke
Copy link

Describe the bug

When using image-set, it can use image in base64, like this:

  cursor: --webkit-image-set(
    url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAQAAAC1+jfqAAAAL0lEQVQoz2NgCD3x//9/BhBYBWdhgFVAiVW4JBFKGIa4AqD0//9D3pt4I4tAdAMAHTQ/j5Zom30AAAAASUVORK5CYII=)
          1x,
        url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAQAAADZc7J/AAAAz0lEQVRIx2NgYGBY/R8I/vx5eelX3n82IJ9FxGf6tksvf/8FiTMQAcAGQMDvSwu09abffY8QYSAScNk45G198eX//yev73/4///701eh//kZSARckrNBRvz//+8+6ZohwCzjGNjdgQxkAg7B9WADeBjIBqtJCbhRA0YNoIkBSNmaPEMoNmA0FkYNoFKhapJ6FGyAH3nauaSmPfwI0v/3OukVi0CIZ+F25KrtYcx/CTIy0e+rC7R1Z4KMICVTQQ14feVXIbR695u14+Ir4gwAAD49E54wc1kWAAAAAElFTkSuQmCC)
          2x
      )
      5 8,
    text;

But after running npm run build, you may get an error. This only happens in the latest version 2.9.8

I think this pr #7874 broke this behavior.

Reproduction

https://stackblitz.com/edit/vitejs-vite-uzayyp?file=src/App.css

System Info

System:
    OS: macOS 11.2.1
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
    Memory: 1.22 GB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.17.0 - ~/.nvm/versions/node/v14.17.0/bin/node
    Yarn: 1.22.17 - ~/.nvm/versions/node/v14.17.0/bin/yarn
    npm: 6.14.13 - ~/.nvm/versions/node/v14.17.0/bin/npm
  Browsers:
    Chrome: 101.0.4951.54
    Edge: 100.0.1185.39
    Firefox: 99.0.1
    Safari: 14.0.3

Used Package Manager

npm

Logs

[vite:css-post] Transform failed with 2 errors:
<stdin>:42:31: ERROR: Expected ")" to end URL token
<stdin>:42:215: ERROR: Expected ")" to end URL token

✘ [ERROR] Expected ")" to end URL token

    <stdin>:42:31:
      42 │   background: image-set(url(url(data:image/png;base64) , url(iVBOR...
         ╵                                ^


✘ [ERROR] Expected ")" to end URL token

    <stdin>:42:215:
      42 │ ...AAAAASUVORK5CYII=)) 1x, url(url(data:image/png;base64) , url(iV...
         ╵                                   ^


error during build:
Error: Transform failed with 2 errors:
<stdin>:42:31: ERROR: Expected ")" to end URL token
<stdin>:42:215: ERROR: Expected ")" to end URL token
    at failureErrorWithLog (/home/projects/vitejs-vite-uzayyp/node_modules/esbuild/lib/main.js:1557:15)
    at eval (/home/projects/vitejs-vite-uzayyp/node_modules/esbuild/lib/main.js:1346:29)
    at eval (/home/projects/vitejs-vite-uzayyp/node_modules/esbuild/lib/main.js:637:9)
    at handleIncomingPacket (/home/projects/vitejs-vite-uzayyp/node_modules/esbuild/lib/main.js:734:9)
    at Socket.readFromStdout (/home/projects/vitejs-vite-uzayyp/node_modules/esbuild/lib/main.js:604:7)
    at Socket.EventEmitter.emit (https://vitejs-vite-uzayyp.w.staticblitz.com/blitz.331c80ffab288536319518a60349d00207075dad.js:6:155505)
    at addChunk (https://vitejs-vite-uzayyp.w.staticblitz.com/blitz.331c80ffab288536319518a60349d00207075dad.js:6:656340)
    at readableAddChunk (https://vitejs-vite-uzayyp.w.staticblitz.com/blitz.331c80ffab288536319518a60349d00207075dad.js:6:656044)
    at Socket.Readable.push (https://vitejs-vite-uzayyp.w.staticblitz.com/blitz.331c80ffab288536319518a60349d00207075dad.js:6:656728)
    at _0x9a1e99.onStreamRead [as onread] (https://vitejs-vite-uzayyp.w.staticblitz.com/blitz.331c80ffab288536319518a60349d00207075dad.js:6:783839)

~/projects/vitejs-vite-uzayyp
❯ npm run build
$ vite build
vite v2.9.8 building for production...
✓ 34 modules transformed.
[vite:css-post] Transform failed with 2 errors:
<stdin>:42:31: ERROR: Expected ")" to end URL token
<stdin>:42:215: ERROR: Expected ")" to end URL token

✘ [ERROR] Expected ")" to end URL token

    <stdin>:42:31:
      42 │   background: image-set(url(url(data:image/png;base64) , url(iVBOR...
         ╵                                ^


✘ [ERROR] Expected ")" to end URL token

    <stdin>:42:215:
      42 │ ...AAAAASUVORK5CYII=)) 1x, url(url(data:image/png;base64) , url(iV...
         ╵                                   ^


error during build:
Error: Transform failed with 2 errors:
<stdin>:42:31: ERROR: Expected ")" to end URL token
<stdin>:42:215: ERROR: Expected ")" to end URL token
    at failureErrorWithLog (/home/projects/vitejs-vite-uzayyp/node_modules/esbuild/lib/main.js:1557:15)
    at eval (/home/projects/vitejs-vite-uzayyp/node_modules/esbuild/lib/main.js:1346:29)
    at eval (/home/projects/vitejs-vite-uzayyp/node_modules/esbuild/lib/main.js:637:9)
    at handleIncomingPacket (/home/projects/vitejs-vite-uzayyp/node_modules/esbuild/lib/main.js:734:9)
    at Socket.readFromStdout (/home/projects/vitejs-vite-uzayyp/node_modules/esbuild/lib/main.js:604:7)
    at Socket.EventEmitter.emit (https://vitejs-vite-uzayyp.w.staticblitz.com/blitz.331c80ffab288536319518a60349d00207075dad.js:6:155505)
    at addChunk (https://vitejs-vite-uzayyp.w.staticblitz.com/blitz.331c80ffab288536319518a60349d00207075dad.js:6:656340)
    at readableAddChunk (https://vitejs-vite-uzayyp.w.staticblitz.com/blitz.331c80ffab288536319518a60349d00207075dad.js:6:656044)
    at Socket.Readable.push (https://vitejs-vite-uzayyp.w.staticblitz.com/blitz.331c80ffab288536319518a60349d00207075dad.js:6:656728)
    at _0x9a1e99.onStreamRead [as onread] (https://vitejs-vite-uzayyp.w.staticblitz.com/blitz.331c80ffab288536319518a60349d00207075dad.js:6:783839)

Validations

@Alsmile
Copy link

Alsmile commented May 9, 2022

+1

rendering chunks (12)...[vite:css-post] Transform failed with 2 errors:
<stdin>:371:34: ERROR: Expected ")" to end URL token
<stdin>:371:218: ERROR: Expected ")" to end URL token

X [ERROR] Expected ")" to end URL token

    <stdin>:371:34:
      371 │ ...rsor: -webkit-image-set(url(url(data:image/png;base64) , url(i...
          ╵                                   ^


X [ERROR] Expected ")" to end URL token

    <stdin>:371:218:
      371 │ ...AAAAASUVORK5CYII=)) 1x, url(url(data:image/png;base64) , url(i...
          ╵  

@github-actions github-actions bot locked and limited conversation to collaborators May 25, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
feat: css regression The issue only appears after a new release
Projects
None yet
Development

No branches or pull requests

3 participants