Cannot expand variable in comment

[gromgull]

Hi,

I'd like to have a variable expanded inside a comment for inserting a cloudfront server in a useminPrepare block:

// build:js #{cloudfront}js/app.min.js

Just outputs the #{} verbatim:

    <!-- build:js(adminapp.src) #{cloudfront}js/testapp.min.js-->

  //
      = " build:js "+cloudfront+"js/app.min.js"

nearly works, but the closing comments ends up on a new line, which confuses useminPrepare:

<!-- build:js(adminapp.src) http://t/js/testapp.min.js
    -->

Is there any way around this?

[jdhealy]

I think

| <!-- build:js(adminapp.src) #{cloudfront}js/testapp.min.js-->

should work.

[ForbesLindesay]

Indeed, jade comments are deliberately pure comments, to allow people to type whatever they like in them.

[monolithed]

The comments are not displayed in the browser, but it the still full-fledged DOM-nodes!

//= BUILD: version

Much better than:

!='<!-- BUILD: ' + version + '-->'

Why not?

[ForbesLindesay]

Because generated comments are currently second class citizens. Comments are designed for commenting rather than anything else.

[monolithed]

Template engines are designed to generate HTML code.
Even the JavaScript API allows us to fully manipulate comments:

function getCommentNodes(node) {
    var treeWalker = document.createTreeWalker(node,
        NodeFilter.SHOW_COMMENT, null, false),

        comments = [];

  while (treeWalker.nextNode()) {
        comments.push(treeWalker.currentNode);
  }

  return comments;
}

// Create a comment
var comment = document.createComment('foo');
document.body.appendChild(comment);

// Get all comments
var comments = getCommentNodes(document.body);

// Iterate over comments
comments.forEach(function (comment) {
  console.log(comment.data); // foo
});

I know a lot of template engines that support my point of view:

HAML:

/
  = variable

/
  #{variable}

EJS

 <!-- <%= variable %> -->

Dust

<--! {variable} -->

Mustache, Handlebars, Hogan

<!-- {{variable}} -->

Fest

<fest:comment>
    <fest:value>variable </fest:value>
</fest:comment>

I can not even remember any template engines that does not support interpolation comments. Only Jade?

[dbeff]

+1 @monolithed

[dopatraman]

why was this closed without resolution

[bickle66]

I have to agree. I use gulp-useref. For cache busting I would love to be able to:

// build:js /js/app.min.js?v=#{version}
script(src="/js/app.js?v=" + version)
// endbuild

[ForbesLindesay]

Because you can just do:

<!--build:js /js/app.min.js?v=#{version}-->
<!--endbuild-->

If you really need that and it's perfectly valid jade. It's also much better to do it this way if you're using this for builds since a lot of build tools that use comments tend to be really sensitive about precise spacing etc. and this gives you total control.

[Ulrikop]

I searched for the variable expanding at comments for the same reason and I found that issue.

I tried the solution with writting the comment directly in html:

<!--build:css #{folder}/app.css-->
<!--endbuild-->

The problem is, that I have something above the block:

meta(charset="utf-8")

<!--build:css #{folder}/app.css-->
<!--endbuild-->

After compiling pug the result is:

<meta charset="utf-8"><!--build:css #{folder}/app.css-->
<!--endbuild-->

The problem is that usemin removes all before build:css and I lose the meta tag (I use already the conig pretty = true)

I can add = "\n" but that is ugly. What is the prefered way?

[jhyland87]

Im also looking for a solution for this as well.

Obviously this isnt a very important issue, just more of an annoyance when you're going for some well-formatted source code, then this one thing throws it off.

[stemsmit]

Ended up with this.

mixin bundleScripts(bundlePath)
    | #{'\n\t'}
    <!-- build:js(#{global.scriptsDest}) #{bundlePath} -->
    block
    | #{'\n\t'}
    <!-- endbuild -->
    | #{'\n\t'}