Multiple css file with one http request

Question

I'm new to Web development so sorry if this question may seem obvious.

I would like to separate my css files in precise categories.

buttons.css
lists.css
reset.css

But I know that doing so, and importing them with pure css, will cause multiple http requests, slowing down the page loading.

I know that something is possible with a language called Sass. Thing is, I would like to avoid it, and try to fix this using only css standard.

Is it even possible? Or sass and other things like it are the only solution?

Thanks!

May be you could keep an nodejs server, which reads all 3 css files, and combine them together to create style.css and send it as one file. — Rohith K N
– Rohith K N, Commented Sep 8, 2019 at 12:04

Quentin · Accepted Answer · 2019-09-08 12:09:28Z

2

You cannot achieve this with plain CSS.

If you want to fetch all the CSS with one HTTP request, then all the CSS needs to be in one file.
If you want to write your CSS in separate files, then they won't be.

You can use a tool which will combine those files into a single file. SASS is one such tool (and one which is very popular, well tested, and abundant in other features). You can write a single file which @imports the CSS files (which, IIRC, will requires .scss file extensions) and otherwise not use any SASS features at all.

You could use other tools instead (such as cat).

edited Sep 8, 2019 at 12:09

answered Sep 8, 2019 at 12:05

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Dominik Schreiber Over a year ago

You could solve that with HTTP/2 Server Push as well: client requests button.css, you send lists.css and reset.css as well. But some build step cat *.css > bundle.css is the more common option, I think.

RavenJeGames Over a year ago

So Sass is the only way you can archive that. I mean sass and other tools like it. Very sad.

Quentin Over a year ago

@RavenMask — Text files are not magic. They can't simultaneously be split up and together. It's a fundamental feature of how the universe works.

Collectives™ on Stack Overflow

Multiple css file with one http request

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related