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

Vite build fail on css-post since 2.9.2 #7717

Closed
7 tasks done
hugoattal opened this issue Apr 13, 2022 · 7 comments · Fixed by #7718
Closed
7 tasks done

Vite build fail on css-post since 2.9.2 #7717

hugoattal opened this issue Apr 13, 2022 · 7 comments · Fixed by #7718
Labels
regression The issue only appears after a new release

Comments

@hugoattal
Copy link
Contributor

hugoattal commented Apr 13, 2022

Describe the bug

Since 2.9.2, I can't build my project. There seems to be some kind of CSS transform error.

I want to add that reverting to 2.9.1 fix the issue, so that might be introduced recently.

[vite:css-post] Transform failed with 2 errors
[...]
 ELIFECYCLE  Command failed with exit code 1.

The ; inside the string in this line seems to be the cause:

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;600;800&family=Rubik:wght@400&family=Source+Code+Pro:wght@400;600&display=swap');

⚠️ Note: I had to modify the esbuild\lib\main.js file to trace it back here, it could be nice to have a better error display.
Btw, I still don't really know if it's cause by Vite or Esbuild...

Reproduction

https://stackblitz.com/edit/vitejs-vite-k8dfzr?file=src%2FApp.vue&terminal=dev

I added the faulty line in the CSS of App.vue.

System Info

System:
    OS: Windows 10 10.0.22000
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
    Memory: 9.58 GB / 31.84 GB
  Binaries:
    Node: 16.13.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.17 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 8.5.4 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22000.120.0), Chromium (100.0.1185.36)
    Internet Explorer: 11.0.22000.120
  npmPackages:
    @vitejs/plugin-vue: ^2.3.1 => 2.3.1
    vite: ^2.9.2 => 2.9.2

Used Package Manager

pnpm

Logs

[...]
[vite:css-post] Transform failed with 2 errors:
<stdin>:1:4371: ERROR: Unterminated string token
<stdin>:73:86: ERROR: Unterminated string token
error during build:
Error: Transform failed with 2 errors:
<stdin>:1:4371: ERROR: Unterminated string token
<stdin>:73:86: ERROR: Unterminated string token
    at failureErrorWithLog (D:\Library\Projects\LunaPark\node_modules\.pnpm\esbuild@0.14.34\node_modules\esbuild\lib\main.js:1603:15)
    at D:\Library\Projects\LunaPark\node_modules\.pnpm\esbuild@0.14.34\node_modules\esbuild\lib\main.js:1392:29
    at D:\Library\Projects\LunaPark\node_modules\.pnpm\esbuild@0.14.34\node_modules\esbuild\lib\main.js:666:9
    at handleIncomingPacket (D:\Library\Projects\LunaPark\node_modules\.pnpm\esbuild@0.14.34\node_modules\esbuild\lib\main.js:763:9)
    at Socket.readFromStdout (D:\Library\Projects\LunaPark\node_modules\.pnpm\esbuild@0.14.34\node_modules\esbuild\lib\main.js:632:7)
    at Socket.emit (node:events:390:28)
    at addChunk (node:internal/streams/readable:315:12)
    at readableAddChunk (node:internal/streams/readable:289:9)
    at Socket.Readable.push (node:internal/streams/readable:228:10)
    at Pipe.onStreamRead (node:internal/stream_base_commons:199:23)
 ELIFECYCLE  Command failed with exit code 1.

Validations

@sapphi-red
Copy link
Member

I feel this one #7691 is affecting. (have not checked)

@sapphi-red sapphi-red added the regression The issue only appears after a new release label Apr 13, 2022
@sapphi-red
Copy link
Member

Yes it works with 7e6a2c8 and it does not work with 8858180.
So #7691 is affecting.

@hugoattal
Copy link
Contributor Author

hugoattal commented Apr 13, 2022

I believe something like this would fix it:

s.replace(/@import\s*(?:[a-z]*\()?(?:"[^"]*"|'[^']*'|[^;]*).*?;/gm, (match) => {

Should I submit a PR or let the maintainers take care of this?

@poyoho
Copy link
Member

poyoho commented Apr 13, 2022

yes, do it now.

@poyoho
Copy link
Member

poyoho commented Apr 13, 2022

And I like this @import\s*[url(]*("[^"]*"|'[^']*').*?; hhhh.

DiD3n added a commit to Newbies-Workplace/jeteo-web that referenced this issue Apr 13, 2022
- downgrate vite version (postcss bug vitejs/vite#7717)
hugoattal added a commit to hugoattal/vite that referenced this issue Apr 13, 2022
hugoattal added a commit to hugoattal/vite that referenced this issue Apr 13, 2022
@hugoattal
Copy link
Contributor Author

Done: #7718

@patak-dev
Copy link
Member

Fixed in vite@2.9.4, thanks for the PR again @hugoattal

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

Successfully merging a pull request may close this issue.

4 participants