Ff145 Release note for CSS module scripts #41654
Conversation
hamishwillee
requested review from
Josh-Cena and
pepelsbey
and removed request for
a team
github-actions
bot
added
Content:JS
|
Preview URLs External URLs (2)URL:
URL:
(comment last updated: 2025-10-27 22:38:06) |
| - : Name that will refer to the default export from the module. Must be a valid JavaScript identifier. | ||
| - `module-name` | ||
| - : The module to import from. Only single quoted and double quoted string literals are allowed. The evaluation of the specifier is host-specified. Most hosts align with browsers and resolve the specifiers as URLs relative to the current module URL (see [`import.meta.url`](/en-US/docs/Web/JavaScript/Reference/Operators/import.meta)). Node, bundlers, and other non-browser environments often define their own features on top of this, so you should find documentation for them to understand the exact rules. The [module specifier resolution](#module_specifier_resolution) section also has more information. | ||
|
|
There was a problem hiding this comment.
FYI @Josh-Cena I moved this statement up to the module name, since that is where it is actually used. I didn't add an example of use - was there a reason you didn't?
There was a problem hiding this comment.
I don't think you should do this, because semantically, the with is attached to the whole import statement and not to the module name. This is included as an afterthought after we introduced everything about the main import statement syntax.
There's no example, because all examples are given in the linked page. Any example here would duplicate what's already in that page.
There was a problem hiding this comment.
@Josh-Cena Thanks. I have undone that commit.
FWIW I thought it meaningful to make this change because the use of with is almost completely hidden. It isn't in the syntax, it's not shown as its own keyword in the list - it is exactly an afterthought. Yet, if you're using this for CSS or JSON and you don't specify the with you'll get an error.
So while I understand that the changes don't match the current structure, to me that is a reflection that the structure is a little broken.
There was a problem hiding this comment.
I think I'm open to a usage-oriented example section, then, like "Importing CSS and JSON", that points readers to the with documentation.
There was a problem hiding this comment.
I'll leave that with you, as I suspect you're opinionated on how it should look. If I as to tackle it I'd do it as a separate PR.
|
This pull request has merge conflicts that must be resolved before it can be merged. |
hamishwillee
force-pushed
the
ff145relnote_css_import_attribute
branch
from
1221b1b to
7767fc8
Compare
github-actions
bot
added
merge conflicts 🚧
|
This pull request has merge conflicts that must be resolved before it can be merged. |
hamishwillee
force-pushed
the
ff145relnote_css_import_attribute
branch
from
7767fc8 to
5be1c24
Compare
github-actions
bot
added
merge conflicts 🚧
|
This pull request has merge conflicts that must be resolved before it can be merged. |
hamishwillee
force-pushed
the
ff145relnote_css_import_attribute
branch
from
5be1c24 to
2545d37
Compare
|
@pepelsbey Can you please review this. |
| ### CSS module scripts | ||
|
|
||
| CSS module scripts are now supported, allowing a stylesheet to be loaded into a script as a {{domxref("CSSStyleSheet")}} instance using the [`import`](/en-US/docs/Web/JavaScript/Reference/Statements/import) statement. | ||
| The `import` statement must also specify the `type` [import attribute](/en-US/docs/Web/JavaScript/Reference/Statements/import/with) and set it to `"css"`, and the stylesheet must be served with the MIME type of `text/css`. |
There was a problem hiding this comment.
| The `import` statement must also specify the `type` [import attribute](/en-US/docs/Web/JavaScript/Reference/Statements/import/with) and set it to `"css"`, and the stylesheet must be served with the MIME type of `text/css`. | |
| The `import` statement must also specify the `type` [import attribute](/en-US/docs/Web/JavaScript/Reference/Statements/import/with) and set it to `"css"`, and the stylesheet must be served with the [media type](/en-US/docs/Web/HTTP/Guides/MIME_types) of `text/css`. |
I think we want to say "media type"
3 participants
FF145 supports CSS module scripts in https://bugzilla.mozilla.org/show_bug.cgi?id=1720570 - i.e. you can import a stylesheet as a module using
importand the import attributetypewith value"css"The support is only in preview, and is disabled by default. This adds update to experimental features and to release note.
Related docs work can be tracked in #41503