ubuntugod
ubuntugod

Reputation: 652

What is an HTML Module?

What exactly is HTML Modules? I understand that it might allow a developer to create HTML as a module like how ES6 Modules are to JavaScript.

But, are these modules basically templates like Mustache, Handlebars and Pug? Or is it like a wrapper around a similar templating system that will allow us to import an HTML file easily into another HTML file?

Will it pave a way to avoid using templating libraries utilizing the Web Components?

[Update] Here is the link to where I found this - https://github.com/w3c/webcomponents/blob/gh-pages/proposals/html-modules-explainer.md

Upvotes: 8

Views: 11599

Answers (1)

vinyll
vinyll

Reputation: 11439

HTML Modules are the new proposal for importing HTML files into a document.

HTML import supported a similar feature and permitted to import an HTML file (eventually containing itself JS and CSS) but it has been deprecated and JS module import has partially substituted that feature.

The point of HTML imports are to complete that part and make possible to import HTML files again instead of JavaScript files only. Today you just can't import files that contain HTML (again, you could do that when meta rel=import href=myfile.html> which is not supported anymore). If you want to do that, you have to write HTML in JavaScript string prior to process it.

The proposal also introduces notions such as import.meta.document that refer to the internal document to be imported.

Note that is it a proposal, even though it could be inserted into the spec, it should then be implemented by browsers, and finally adopted by the community in order to remain and become a stable feature.

Currently the closest you can use is the Lego Web-Component library that allows to include HTML as a module and extends native HTML functionality:

<template>
  <p>Hello World!</p>
</template>

Used as:

<script src="./dist/index.js" type="module"></script>
<hello-world />

Example taken from https://github.com/polight/lego#hello-world

Let's see how the spec is going to evolve for HTML Modules in the future…

Upvotes: 8

Related Questions