Re: [WICG/webcomponents] HTML Modules (#645)

edbaafi left a comment (WICG/webcomponents#645)

Hello [justinfagnani](https://github.com/justinfagnani) and all!  I'm not sure if this is the right place to post this, but now that the [import attributes proposal](https://github.com/tc39/proposal-import-attributes) has reached stage 4, and all major browsers besides Firefox are already supporting `import json from './some.json' with {type: 'json'}` (and [Chrome supports `{type: 'css'}`](https://web.dev/articles/css-module-scripts)) perhaps it's time to revisit the JavaScript side of the HTML import question.

Consider the following:

```
import styleSheet from './custom-element.css' with {type: 'css'};
import template from './custom-element.html' with {type: 'html'};

export class CustomElement extends HTMLElement {

    #shadowRoot;

    constructor() {
        super();
        this.#shadowRoot = this.attachShadow({ mode: 'closed' });
        this.#shadowRoot.adoptedStyleSheets = [styleSheet];
        this.#shadowRoot.appendChild(template.content.cloneNode(true));
    }
}
```

This is basically what [jfbrennan](https://github.com/jfbrennan) posted above but using the newly added `with` syntax.  

I'm already doing this with a rollup plugin at build time and it feels really clean.

Any thoughts?

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

Message ID: <WICG/webcomponents/issues/645/2675771280@github.com>

Received on Friday, 21 February 2025 22:49:48 UTC