Declarative CSS Modules - <script> vs <style> for defining modules

[KurtCattiSchmidt]

What is the issue with the HTML Standard?

This topic is for discussion of https://github.com/whatwg/html/issues/10673, which is a Stage 1 proposal.

Our original explainer (MSEdgeExplainers/ShadowDOM/explainer.md at main · MicrosoftEdge/MSEdgeExplainers) uses <script> tags to define Declarative CSS Modules, but consensus seems to be overwhelmingly in favor of using a <style> tag instead.

Specifically, this example:

<script type="css-module" specifier="/foo.css"> 
  #content { 
    color: red; 
  } 
</script>

Would change to this:

<style type="module" specifier="/foo.css"> 
  #content { 
    color: red; 
  } 
</style>

The type="module" attribute is necessary to prevent styles from applying to the main document by default (this was one of the reasons for using the <script> tag initially).

The HTML5 Specification explicitly only allows <script> tags to have a type attribute of either:

1. No type attribute
2. type="text/css"

See https://html.spec.whatwg.org/#update-a-style-block - this will need to be amended to include a stage for Declarative CSS Modules.

Pros for the Githubissues.

Githubissues is a development platform for aggregating issues.