underscore-template-loader icon indicating copy to clipboard operation
underscore-template-loader copied to clipboard

Can I pass some parameters in require macro?

Open cfour-hi opened this issue 6 years ago • 8 comments

I have a header.html template, It is used on every page, and each page has some differences. This is easy to implement if I can pass some parameters in require macro, like:

index.html

@require('path/to/header.html', { name: 'monine' })
// or
@require('path/to/header.html')({ name: 'monine' })

How can I achieve this?

cfour-hi avatar Jul 23 '17 13:07 cfour-hi

Hi, I don't think we currently support this but it looks like it would be really useful. Let me think how we can achieve this. The thing is that we might need to extend our current implementation of the require macro:

require: function (resourcePath) {
        return "require(" + JSON.stringify(loaderUtils.urlToRequest(resourcePath)) + ").apply(null,arguments)";

At first view, it might require to extend the arguments array with some given object...

emaphp avatar Jul 24 '17 17:07 emaphp

Hi @emaphp Thanks for your help. I've just tried the new version (0.8) and it solved my problem. :+1:

cfour-hi avatar Jul 31 '17 07:07 cfour-hi

Hi @emaphp Here's a new problem with HtmlWebpackPlugin.

header.html

<header>
<% if (name) { %>
<h1><%= name %></h1>
<% } %>
</header>

page-a.html

@require('path/to/header.html', { "name": 'monine' })

page-b.html

@require('path/to/header.html')

There will be throw a error from HtmlWebpackPlugin: Template execution failed: ReferenceError: name is not defined

Because of require macro does not provide arguments in page-b.html. but header.html needs it...

Or should I commit this issue to HtmlWebpackPlugin?

cfour-hi avatar Jul 31 '17 08:07 cfour-hi

Not sure how that plugin works. I might take a look at it. Could you provide more information about what are you trying to achieve? thx

emaphp avatar Aug 01 '17 18:08 emaphp

It happened like this: Some pages will provide arguments and some pages will not provide arguments in require macro.

If require macro not provide arguments. The elements (required arguments) will not renders in template (header.html)

In the comments above. page-b.html does not provide aruments in require macro. So it only renders <haeder></header>. No element of h1 in content.

There will be a problem with HtmlWebpackPlugin. It will evaluate the html factory and replace it with its content once everything is compiled. If an undefined variable is present. it is throw error.

If the HTML template received by HtmlWebpackPlugin has been replaced by the underscore-template-loader compiler. It will be fine?

cfour-hi avatar Aug 02 '17 03:08 cfour-hi

@emaphp

Is there any problem or is not clear of my description?

My English is not good, I had tried to say that I can say it and I hope I can got your response about my issue. For better or for worse.

Looking forward to your response.

cfour-hi avatar Aug 31 '17 01:08 cfour-hi

@Monine no worries, it is clear to me that this is happening while using the HtmlWebpackPlugin. Not an expert on that though. I'll let you know if I can come up with something.

emaphp avatar Sep 03 '17 19:09 emaphp

Hi, the thread is quite old but still open, just came across it and wanted to share my solution for the problem of Template execution failed: ReferenceError: name is not defined. So the workaround is just to ensure the variable exist somewhere before usage:

<% const theTile = (typeof title !== 'undefined' && title) || 'Default Title' %>

<title><%= theTitle %></title>

idudinov avatar Oct 18 '18 09:10 idudinov