(WIP)RFC-004: CSS support

[h-a-n-a]

Summary

Add CSS support for rspack. The high-level idea of this proposal is as follows:

1. Treat CSS as the first class citizen in the overall architecture of rspack and convert CSS to JS only if necessary
2. Emit CSS chunk-level and runtime support for loading CSS (replace try-catch workaround)
3. Reuse the result of Asset module and replace the URL with resource or inline assets
4. Support chunk-level HMR API to hot reload CSSs and make HMR propagations as tiny as possible
5. Out of the box CSS module support

Motivation

Detailed design

CSS resolution

Assets handling

External resource handling

@import url("cdn/some.css")

Import with condition

@import url("fineprint.css") print;
@import url("bluish.css") print, screen;
@import "common.css" screen;
@import url('landscape.css') screen and (orientation: landscape);
@import url("narrow.css") supports(display: flex) screen and (max-width: 400px);

CSS modules

Runtime

HMR runtime

Drawbacks

Alternatives

Pior art

Webpack

Parcel

Unresolved questions