-
-
Notifications
You must be signed in to change notification settings - Fork 6.2k
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 plugin css, build crash #10689
Labels
Comments
Sounds good to me. Would you like to send a PR to use that regex? It's a bit hard to read so maybe we should have a comment that links to https://stackoverflow.com/a/36328890 too. |
Hello @Woyken. We like your proposal/feedback and would appreciate a contribution via a Pull Request by you or another community member. We thank you in advance for your contribution and are looking forward to reviewing it! |
mrkldshv
added a commit
to mrkldshv/vite
that referenced
this issue
Nov 1, 2022
9 tasks
bluwy
pushed a commit
that referenced
this issue
Nov 3, 2022
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Describe the bug
I'm trying to build one of our company's projects using vite
It is crashing with error
[vite:css-post] Maximum call stack size exceeded
Solution
From the error I narrowed it down that error occurs because of this regex:
Found this answer on stack overflow:
https://stackoverflow.com/a/36328890
Turns out we can write more performant regex without "lazy"(?) modifier
I modified it in node modules directly to this:
And it all works just fine.
Tried executing this regex manually, it was noticeably faster.
Huge CSS source maps
I modified it to output whole CSS, before comment cleanup, looks like a lot of source maps (for each scss file) were added, each containing 4000000++ characters.
Node js with this big amount of data, when using "lazy ." (.?) inside current regex crashes.
Generated complete CSS file before cleanup and modification with all those symbols contains 140635835 characters
I'm not sure what to do about reproduction example.
I tried generating huge SASS files with huge source map entries, but it didn't seem to care.
Something in our case is causing regex to be even more inefficient for this particular case.
Reproduction
Cannot reproduce it exactly without using company's confidential packages
Steps to reproduce
Import a lot of scss files from node_modules containing source maps.
Generated output will contain those source maps.
For some reason it reproduced only when adding @import url("https://fonts.googleapis.com/css?family=Dancing+Script");
I suspect regex is matching something that make it consume even more steps
System Info
Used Package Manager
npm
Logs
Click to expand!
Validations
The text was updated successfully, but these errors were encountered: