Hugo: Add template delimiters ("{{") config

[bep]

For Angular etc.

[kaushalmodi]

Related (same?):

• https://github.com/gohugoio/hugo/issues/1044
• https://discourse.gohugo.io/t/double-curly-brace-conflict-override/979

[bep]

Related (same?):

A little more specific. I saw a really cool Angular demo yesterday, which would have failed badly in Go templates.

But you kind of want to reuse some theme templates etc., so a global setting would be bad.

[flexchar]

In addition to Laravel suggestion https://github.com/gohugoio/hugo/issues/1044#issuecomment-289280859 I have taken the different approach, it is not, however, a solution to Hugo config but does eliminate a headache.

Instead of fighting with Hugo to inconveniently output perfect double curly braces I changed delimiters in my front-end framework to ${ }. So far it solves the issue and works like a charm.

Since I migrated to VueJS, here is how to set them: (src)

// In your VueJS instance 
let app = new Vue({
    delimiters: ['${', '}'], //change delimiters
    el: ''  // continue with other options

For AngularJS users: (src)

// AngularJS Module
angular.module('app', [])
    .config(function($interpolateProvider) {
        $interpolateProvider.startSymbol('${');
        $interpolateProvider.endSymbol('}');
    })
// further angular logic...

I am sure that nearly every JS framework will let you change. Just google for _delimiters_ option.

---

As for the suggestion, what about making it like shortcode.

For instance, as a FUNCTION

{{  js "myVarHere" }} 
//renders to {{myVarHere}}

or with PIPING

{{ "myVarHere"  | js }} 
//renders to {{myVarHere}}

With Hugo config file allowing to change desired output.

[bep]

@flexchar yea, you may be right. Thinking about this, the "per output formats" option would not work too great either. Will have to think harder on this.

[regisphilibert]

{{ js "myVarHere" }}

I like @flexchar suggestion. Templates will often have a little bit of both (Hugo curlies and Angular curlies)

[regisphilibert]

Even better the function could take two optional parameter (openTag, closeTag) which could default to a global site parameter.

[bep]

I like @flexchar suggestion. Templates will often have a little bit of both (Hugo curlies and Angular curlies)

There is printf for his suggestion.

{{ printf "{{ %s }}" | "alert('Hugo Rules!');" | safeJS }}