-
Notifications
You must be signed in to change notification settings - Fork 1.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
CSS optimisations #2936
Comments
Please provide an example of what you want the input and output to be. There isn't enough information here to know what you mean. |
// index.ts
import "./style1.css";
import "./style2.css";
import "./style3.css"; /* style1.css */
@charset "utf-8";
@import url("https://fonts.googleapis.com/css?family=Oswald:300,400,700");
@import url(https://fonts.googleapis.com/css?family=Roboto:400,500);
@font-face {
font-family: "VeraSeBd";
src: url(https://mdn.github.io/css-examples/web-fonts/VeraSeBd.ttf);
}
.class1 {
height: 909px;
} /* style2.css */
@charset "utf-8";
@font-face {
font-family: "VeraSeBd";
src: url("https://mdn.github.io/css-examples/web-fonts/VeraSeBd.ttf");
}
.class2 {
width: 300px;
} /* style3.css */
.class3 {
color: red;
}
@import url(https://fonts.googleapis.com/css?family=Roboto:400,500); Current css bundle output @charset "UTF-8";
@import "https://fonts.googleapis.com/css?family=Oswald:300,400,700";
@import "https://fonts.googleapis.com/css?family=Roboto:400,500";
/* style1.css */
@font-face {
font-family: "VeraSeBd";
src: url(https://mdn.github.io/css-examples/web-fonts/VeraSeBd.ttf);
}
.class1 {
height: 909px;
}
/* style2.css */
@font-face {
font-family: "VeraSeBd";
src: url(https://mdn.github.io/css-examples/web-fonts/VeraSeBd.ttf);
}
.class2 {
width: 300px;
}
/* style3.css */
.class3 {
color: red;
}
@import url(https://fonts.googleapis.com/css?family=Roboto:400,500); Excepted/optimised output @charset "UTF-8";
@import "https://fonts.googleapis.com/css?family=Oswald:300,400,700";
@import "https://fonts.googleapis.com/css?family=Roboto:400,500";
/* style1.css */
@font-face {
font-family: "VeraSeBd";
src: url(https://mdn.github.io/css-examples/web-fonts/VeraSeBd.ttf);
}
.class1 {
height: 909px;
}
/* style2.css */
.class2 {
width: 300px;
}
/* style3.css */
.class3 {
color: red;
} |
The problem you're having with the
Moving it up to the top of the file where it should be fixes your problem for me, so you should make that change on your end. That's not something that esbuild should fix itself. Invalid The |
Awesome! |
Hello @evanw
Is is possible to deduplicate and move all @import and @font-face rules to the top of css bundle as you do with @charset?
The text was updated successfully, but these errors were encountered: