nesting {{helper name}} within {} causes parsing error

[michaelleone]

G'day mate! Thanks for the insanely useful plugin, its awesome!

However I can't get the pascalHelper to add my filename as my CSS class name (CSS Modules), have pictured below. Any suggestions, did I miss something obvious? Appears to be an issue with nesting the helper moustache within another set of curly braces?

Cheers,

Mick

[michaelleone]

Hmmm, okay, it works with a space added after the helper moustache:

<div className={ styles.{{pascalCase name}} }>

I can live with that :)

[michaelleone]

A suggestion! How about allowing use of VSCode user snippets in the template files? e.g. provide a placeholder for snippet names in the templates: {{snippetName: blahblah}}. That way the templates could be made as snippets including the curser positioning functions etc...

[michaelleone]

Still an issue really... Adding a space before and after the enclosing curly braces does solve the parsing issue however it results in compiled format of className={ styles.FileName } which STANDARD Linting dislikes (and I agree):

[reesemclean]

Hmm... I will take look over the weekend. We use handlebars internally so if you find a solution related to that it should work here.

…

On Jun 29, 2018, at 5:32 AM, michaelleone ***@***.***> wrote: Still an issue really... Adding a space before and after the enclosing curly braces does solve the parsing issue however it results in compiled format of className={ styles.FileName } which STANDARD Linting dislikes (and I agree): — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or mute the thread.

[michaelleone]

kk will look into it!

…

[reesemclean]

Here's the solution: http://handlebarsjs.com/expressions.html#whitespace-control

<div className={styles.{{pascalCase name~}} }>

☝️ should do it. The ~ tells it to remove the whitespace the tag is replaced! Gonna close this out.