open-wc/create

[FEATURE REQUEST] Adding template engine rendering

movrack opened this issue · 5 comments

Hello,

We are extending this project to generate our projects bases on frontend form/backend api to configure the content to be generated.

But to writes templates, actually, we can just replace variables.
It means when we have case like loop (for example rendering a list of components), then we have to write/render "ourself" the looped elements inside a variable and then inject the the variable in the template.
It means that the template just content the variable and hide the loop.
-> not clear
-> template content splitted with variable generation and template.

Expected feature

  • Have template engine
  • (ideally) Have linting plugin for templates files
  • Be able to escape tags. Supposing template engine use ${ }, in my case my projects are in litElement and it also use ${} I wouldn't have clash between parsed ${} and rendered ${}.

I don't know which is the best template engine at the moment in JS but here some of them:

  • Nunjuck
  • EJS
  • Mustashe
  • Handlebars

Based on trends and size
https://www.npmtrends.com/ejs-vs-handlebars-vs-pug-vs-nunjucks-vs-mustache-vs-hbs
I am doing some try with EJS.

It looks also to have some linter plugins

I already have a first work with EJS, but I have a question.
At the moment I keep defaults tags <%? and ?%> (where ? is an other character depending on the expected behavior).

  • < is open "delimiter"
  • % is the "delimiter"
  • > is the "close delimiter"
    https://ejs.co (search for "tags" and "delimiter")

Since current template use <%, I will keep it like this, but I can see behaviors where peoples want to extends this project and use other delimiter. Do you think I have to specify some option file that can be overridden or via command options ?
And how do you see this config file ?

Regards,

I would say to use the ejs default <%= that way we can link to the ejs docs and no one get's confused.
it should not be configurable (if you need that you need to extend and modify it yourself)

Ok, it will be easier for me :)
I already made some test, excepted the unit test I did adapt, the rest work as before.
Even with project extending this one.

has been implemented via #6