How to load an external css file before the compressed css?

Hi, I need to load a external css file but need to load it before the compressed css files so I can override it’s styles with my own. How can I do it?

The main reason to make this css file (semantic-ui) external is to reduce the build time. What if I move it to a package? Will meteor compress the css file every-time it reloads?

Curious if it made much of a difference with build time.

Unfortunately it did :frowning: Without the semantic-ui package, the build time is nearly 2,000 ms. With the package it’s nearly 6,500 ms! If we remove the package and add the raw semantic-ui css, the build time is 3,500 ms. That’s also a bit high. I have a project with bootstrap with even more packages and it goes only upto 2,500 ms! :slight_smile:

I wonder if removing standard-minifiers (package) would help. Or using post-css instead.

Or maybe you want to make all your stylesheets external. Then, use an npm script to do minification when you want to deploy to production.

1 Like

Great idea! But I tried to using external style sheets. But external styles load at last. After the styles I define in the app. So I can’t override them in my styles. Any other way to do it other than moving all css outside including the app css?

Maybe in your app css try loading an external css stylesheet wtih @import at the top of the file.

1 Like

Great Thanks! I’ll try it out!