Re: [w3c/webcomponents] define behavior of `@import` in Cascading Style Sheet (CSS) modules (#870)

I think there's problem with current semantics and module-like semantics mixing. A constructible stylesheet is shared and can be mutated and effect every scope it's applied to. `@imported` stylesheets being separate objects would break this behavior.

I would argue that given this setup, with a shared theme.css file:

theme.js:
```css
p { color: red; }
```

my-component.css:
```css
@import '../theme.css'; /* URLs would ideally be resolved to the referring CSS module's URL, not the document */
...
```

my-component.js:
```js
import styles from './my-component.css';
```

That this code should result in the component's styles changing:

my-app.js:
```js
import themeStyles from './theme.css';

themeStyles.cssRules[0].style.setProperty('color', 'blue');
```

because this is what would happen if the component imported `theme.css` directly. There shouldn't be a difference between the two.

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/webcomponents/issues/870#issuecomment-599716198