Govuk-frontend-svelte NPM

Playground for what could become a nunjucks -> svelte converter.

General idea:

parse nunjucks template to AST
transform nunjucks AST to svelte AST
write (format) svelte template

Ideally we could contribute the tranformer and formatter back to meta-template although that project has no concept of transformation currently.

For ideas we should look at babel etc.. These transpilers work the same way as we're targeting - e.g. take typescript, build AST, transform AST, write javascript.

translate.js is the entry point for this playground. Run it and it will convert all macro.njk files in the govuk-frontend dependency into svelte templates in build. The svelte template is called the macro name.

format.js is used to write out the AST in the svelte format. This contains a number of Noop functions that need to be implemented for us to get full support for the govuk nunjucks templates.

check.js iterates over all converted templates, renders them and compares them. This isn't fully implemented as svelte doens't seem to have a renderer or it renders as a component that will render itself when loaded in the browser / called on the server - need to sort out.

Note though in check.js the svelte compile function returns an AST. This be very useful to us as the result of the transformation on the nunjucks AST should look like the svelte AST. It is probably worth hand coding some svelte templates just to get a look at the AST, for example straight away you can see it has html, css and script Fragment nodes un der the root node.