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

fix(css): handle lightningcss minification in Deno #17372

Merged
merged 1 commit into from
Jun 3, 2024

Conversation

easymikey
Copy link
Contributor

Description

Improve lightningcss in Deno. Fix the resulting css when build artifacts with lightningcss.

The previous fix was within the scope of this PR

Initial css

h1 {
  font-size: 24px;
}

.main {
  border: 1px solid gray;
  color: red;
}

Incorrect result css

104,49,123,102,111,110,116,45,115,105,122,101,58,50,52,112,120,125,46,103,80,77,114,69,87,95,109,97,105,110,123,99,111,108,111,114,58,114,101,100,59,98,111,114,100,101,114,58,49,112,120,32,115,111,108,105,100,32,103,114,97,121,12558,114,111,111,116,123,45,45,108,105,103,104,116,110,105,110,103,99,115,115,45,108,105,103,104,116,58,105,110,105,116,105,97,108,59,45,45,108,105,103,104,116,110,105,110,103,99,115,115,45,100,97,114,107,58,32,59,99,111,108,111,114,45,115,99,104,101,109,101,58,108,105,103,104,116,32,100,97,114,107,59,99,111,108,111,114,58,35,102,102,102,102,102,102,100,101,59,102,111,110,116,45,115,121,110,116,104,101,115,105,115,58,110,111,110,101,59,116,101,120,116,45,114,101,110,100,101,114,105,110,103,58,111,112,116,105,109,105,122,101,108,101,103,105,98,105,108,105,116,121,59,45,119,101,98,107,105,116,45,102,111,110,116,45,115,109,111,111,116,104,105,110,103,58,97,110,116,105,97,108,105,97,115,101,100,59,45,109,111,122,45,111,115,120,45,102,111,110,116,45,115,109,111,111,116,104,105,110,103,58,103,114,97,121,115,99,97,108,101,59,98,97,99,107,103,114,111,117,110,100,45,99,111,108,111,114,58,35,50,52,50,52,50,52,59,102,111,110,116,45,102,97,109,105,108,121,58,73,110,116,101,114,44,115,121,115,116,101,109,45,117,105,44,45,97,112,112,108,101,45,115,121,115,116,101,109,44,66,108,105,110,107,77,97,99,83,121,115,116,101,109,70,111,110,116,44,83,101,103,111,101,32,85,73,44,82,111,98,111,116,111,44,78,111,116,111,32,83,97,110,115,44,85,98,117,110,116,117,44,67,97,110,116,97,114,101,108,108,44,72,101,108,118,101,116,105,99,97,32,78,101,117,101,44,65,118,101,110,105,114,44,72,101,108,118,101,116,105,99,97,44,65,114,105,97,108,44,115,97,110,115,45,115,101,114,105,102,59,102,111,110,116,45,119,101,105,103,104,116,58,52,48,48,59,108,105,110,101,45,104,101,105,103,104,116,58,49,46,53,125,64,109,101,100,105,97,32,40,112,114,101,102,101,114,115,45,99,111,108,111,114,45,115,99,104,101,109,101,58,100,97,114,107,41,123,58,114,111,111,116,123,45,45,108,105,103,104,116,110,105,110,103,99,115,115,45,108,105,103,104,116,58,32,59,45,45,108,105,103,104,116,110,105,110,103,99,115,115,45,100,97,114,107,58,105,110,105,116,105,97,108,125,125,97,123,99,111,108,111,114,58,35,54,52,54,99,102,102,59,45,119,101,98,107,105,116,45,116,101,120,116,45,100,101,99,111,114,97,116,105,111,110,58,105,110,104,101,114,105,116,59,116,101,120,116,45,100,101,99,111,114,97,116,105,111,110,58,105,110,104,101,114,105,116,59,102,111,110,116,45,119,101,105,103,104,116,58,53,48,48,125,97,58,104,111,118,101,114,123,99,111,108,111,114,58,35,53,51,53,98,102,50,125,98,111,100,121,123,112,108,97,99,101,45,105,116,101,109,115,58,99,101,110,116,101,114,59,109,105,110,45,119,105,100,116,104,58,51,50,48,112,120,59,109,105,110,45,104,101,105,103,104,116,58,49,48,48,118,104,59,109,97,114,103,105,110,58,48,59,100,105,115,112,108,97,121,58,102,108,101,120,125,104,49,123,102,111,110,116,45,115,105,122,101,58,51,46,50,101,109,59,108,105,110,101,45,104,101,105,103,104,116,58,49,46,49,125,98,117,116,116,111,110,123,99,117,114,115,111,114,58,112,111,105,110,116,101,114,59,98,97,99,107,103,114,111,117,110,100,45,99,111,108,111,114,58,35,49,97,49,97,49,97,59,98,111,114,100,101,114,58,49,112,120,32,115,111,108,105,100,32,35,48,48,48,48,59,98,111,114,100,101,114,45,114,97,100,105,117,115,58,56,112,120,59,112,97,100,100,105,110,103,58,46,54,101,109,32,49,46,50,101,109,59,102,111,110,116,45,102,97,109,105,108,121,58,105,110,104,101,114,105,116,59,102,111,110,116,45,115,105,122,101,58,49,101,109,59,102,111,110,116,45,119,101,105,103,104,116,58,53,48,48,59,116,114,97,110,115,105,116,105,111,110,58,98,111,114,100,101,114,45,99,111,108,111,114,32,46,50,53,115,125,98,117,116,116,111,110,58,104,111,118,101,114,123,98,111,114,100,101,114,45,99,111,108,111,114,58,35,54,52,54,99,102,102,125,98,117,116,116,111,110,58,102,111,99,117,115,123,111,117,116,108,105,110,101,58,52,112,120,32,97,117,116,111,32,45,119,101,98,107,105,116,45,102,111,99,117,115,45,114,105,110,103,45,99,111,108,111,114,125,98,117,116,116,111,110,58,102,111,99,117,115,45,118,105,115,105,98,108,101,123,111,117,116,108,105,110,101,58,52,112,120,32,97,117,116,111,32,45,119,101,98,107,105,116,45,102,111,99,117,115,45,114,105,110,103,45,99,111,108,111,114,125,64,109,101,100,105,97,32,40,112,114,101,102,101,114,115,45,99,111,108,111,114,45,115,99,104,101,109,101,58,108,105,103,104,116,41,123,58,114,111,111,116,123,99,111,108,111,114,58,35,50,49,51,53,52,55,59,98,97,99,107,103,114,111,117,110,100,45,99,111,108,111,114,58,35,102,102,102,125,97,58,104,111,118,101,114,123,99,111,108,111,114,58,35,55,52,55,98,102,102,125,98,117,116,116,111,110,123,98,97,99,107,103,114,111,117,110,100,45,99,111,108,111,114,58,35,102,57,102,57,102,57,125,125{}
Uint8Array(63) [
  104,  49, 123, 102, 111, 110, 116,  45, 115, 105, 122,
  101,  58,  50,  52, 112, 120, 125,  46, 103,  80,  77,
  114,  69,  87,  95, 109,  97, 105, 110, 123,  99, 111,
  108, 111, 114,  58, 114, 101, 100,  59,  98, 111, 114,
  100, 101, 114,  58,  49, 112, 120,  32, 115, 111, 108,
  105, 100,  32, 103, 114,  97, 121, 125
]

Correct result css

h1{font-size:24px}.gPMrEW_main{color:red;border:1px solid gray}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#242424;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}a{color:#646cff;-webkit-text-decoration:inherit;text-decoration:inherit;font-weight:500}a:hover{color:#535bf2}body{place-items:center;min-width:320px;min-height:100vh;margin:0;display:flex}h1{font-size:3.2em;line-height:1.1}button{cursor:pointer;background-color:#1a1a1a;border:1px solid #0000;border-radius:8px;padding:.6em 1.2em;font-family:inherit;font-size:1em;font-weight:500;transition:border-color .25s}button:hover{border-color:#646cff}button:focus{outline:4px auto -webkit-focus-ring-color}button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}
<Buffer 68 31 7b 66 6f 6e 74 2d 73 69 7a 65 3a 32 34 70 78 7d 2e 67 50 4d 72 45 57 5f 6d 61 69 6e 7b 63 6f 6c 6f 72 3a 72 65 64 3b 62 6f 72 64 65 72 3a 31 70 ... >
<Buffer 3a 72 6f 6f 74 7b 2d 2d 6c 69 67 68 74 6e 69 6e 67 63 73 73 2d 6c 69 67 68 74 3a 69 6e 69 74 69 61 6c 3b 2d 2d 6c 69 67 68 74 6e 69 6e 67 63 73 73 2d ... >

Copy link

stackblitz bot commented Jun 1, 2024

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@easymikey
Copy link
Contributor Author

@bluwy I'll ask for your review. You're in the context :)

@easymikey easymikey changed the title fix(css): handle lightningcss build minify in Deno fix(css): handle lightningcss minification in Deno Jun 1, 2024
@easymikey easymikey force-pushed the fix-handle-lightningcss-build-minify branch from daa8d13 to caa6444 Compare June 1, 2024 17:48
Copy link
Member

@bluwy bluwy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks!

@bluwy bluwy merged commit b3f5bd1 into vitejs:main Jun 3, 2024
11 checks passed
@easymikey easymikey deleted the fix-handle-lightningcss-build-minify branch June 3, 2024 12:45
@bluwy bluwy mentioned this pull request Jun 7, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants