Including html partials within html partials without the interpolate option

[leo-petrucci]

Documentation Is:

• Missing
• Needed
• Confusing
• Not Sure?

Please Explain in Detail...

At some point in the past html-loader had an interpolate option. This allowed to load partials within partials in templates. As far as understand it this recently got deprecated and replaced with preprocessor.

So, answers like this one aren't working anymore.

A couple of questions like this one asking how to achieve it popped up, but they've gone without answers.

The documentation seems unclear as if this is still possible as the only example mentions handlebars and only shows this implementation within the webpack config.

Your Proposal for Changes

Is there any chance an official explanation of how to achieve this could be provided in the docs or even in this thread? I've tried everything possible and I'm absolutely lost.

[leo-petrucci]

I ended up reverting to 0.5.5, which works without any problems. I'm unsure why this breaking change was included without a way to replace it?

[alexander-akait]

Can you provide example how you want to include? You have JS, so you can include anything

[leo-petrucci]

Can you provide example how you want to include?

Including already works:

<%= require('html-loader!../components/navbar/index.html') %>

The problem is that without the interpolate option (as well as the root option), if one of the files I include has another inclusion within it, then it won't actually be included. This means I can't have a component within a component which severely limits what's possible.

Why not bring back how it used to work?:

<%= require('html-loader?root=.&interpolate!../components/sidebar/index.html') %>

You have JS, so you can include anything

If I include from JS it will be added client side, which is of course not great for SEO. I need Webpack to build all my files into a single component.

[alexander-akait]

It is out of scope HTML spec, HTML doesn't support <=% require() %=>, so we do not support it, you need loader for this loader, also JS has import and it can be used with it

[alexander-akait]

https://github.com/webpack-contrib/html-loader#preprocessor

You should always return valid HTML

[leo-petrucci]

It is out of scope HTML spec, HTML doesn't support <=% require() %=>, we doesn't support it, you need loader for this loader, also JS has import and it can be used with it

The html-loader already supports <=% require() %=>. Either way that's not my point.
I'm not asking to support <=% require() %=>, I'm asking to either:

• Get an entry in the docs to explain how to properly replace interpolate with preprocessor to allow html components
• Bring back interpolate so that interpolating html is possible

Which are not out of scope

[alexander-akait]

Get an entry in the docs to explain how to properly replace interpolate with preprocessor to allow html components

We have examples for handlebars/PostHTML, it is a most popular solutions, we can't cover all edge cases

Bring back interpolate so that interpolating html is possible

No interpolating more, if you need it you can create own loader, we support only pure HTML, because it will be part of core webpack, webpack supports non standard stuff only through loaders/plugins

[alexander-akait]

The html-loader already supports <=% require() %=>.

It is just luck that you did not receive an error while parsing.

[alexander-akait]

I strongly recommend migrate on a template system, using require is the bad solution and have many bugs and limitations

[leo-petrucci]

Would it be a problem if I spun html-loader 0.5.5 (the last version that supported this) into its own loader?

The demand is there and people clearly prefer using this rather than learning some other templating system. It's also the suggested way by webpack-html-plugin to load partial HTML files, so it seems a bit closeminded to say

It is just luck that you did not receive an error while parsing.

As far as I see it there's not really enough information on how to use preprocessor. It would probably serve the function I'm asking fairly well, it's just unclear how I could set preprocessor to use a normal loader rather than another library to process my files.

On top of that the changelog states:

the interpolate option was removed, please consider migration on the preprocessor

But doesn't offer much explanation on how to do so.

[alexander-akait]

Would it be a problem if I spun html-loader 0.5.5 (the last version that supported this) into its own loader?

Yep, you can do it temporary, but I would advise speed up migration on a template system

The demand is there and people clearly prefer using this rather than learning some other templating system. It's also the suggested way by webpack-html-plugin to load partial HTML files, so it seems a bit closeminded to say

We should remove it from examples

As far as I see it there's not really enough information on how to use preprocessor. It would probably serve the function I'm asking fairly well, it's just unclear how I could set preprocessor to use a normal loader rather than another library to process my files.

Yep, we can improve docs about it.

On top of that the changelog states:

the interpolate option was removed, please consider migration on the preprocessor
But doesn't offer much explanation on how to do so.

I provide examples for handlebars/PostHTML, I thought that was enough, maybe improving it for compatibility with other loaders will be great