Re: [csswg-drafts] [CSS Import Once] @import-once, or some syntax for importing a stylesheet only once (#6130)

> @trusktr Can you clarify how CSS Modules have the same behavior as the proposed `@import-once`.

They currently don't for code written in CSS, because `@import` is disallowed in constructible stylesheets (hence disallowed in CSS Modules).

It makes a lot of sense though, for an `import` feature to be restored to CSS modules and having it align with developer mentality of JS modules (modules being singletons, not includes).

This is the future of CSS development that is at stake here. Settling for "just use namespaces" (i.e. layers) is doomed to fail, once developers working in a specific namespace start to clobber things within that namespace.

*Modules are the next proven evolution after namespaces.*

---



> ```
> ```
> <script type="module">
>  import a from './a.css' assert { type: "css" };
>  import b from './b.css' assert { type: "css" };
>  document.adoptedStyleSheets = [a, b, a];
> </script>
> ```
> 
> 
>     
>       
>     
> 
>       
>     
> 
>     
>   
> This applies a twice and in the same order as the array.
> It doesn't only apply the first a.
> ```

This is certainly not ideal, a pattern to be avoided.

Also, that is not related to `import`. It's like saying here, apply these things, and it does.

A CSS import feature would operate in a better way, and *that would be the best practice to follow*.

Same thing in JavaScript:

```js
import a from './a.js'
import b from './b.js'

a()
b()
a()
```

Apply a, then b, then a. It is tangential to a proper import mechanism.

If a developer wants to apply stylesheets multiple times, they can do that, while a new import feature would work properly when a *root level* style sheet is applied *only once*.

There is no way to fix existing APIs, we can only provide a new API to create a new *best practice*, and existing APIs should not prevent us from doing so.

-- 
GitHub Notification of comment by trusktr
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/6130#issuecomment-1969778332 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Wednesday, 28 February 2024 20:05:13 UTC