Include Template Path in hydrogen.routes.js

[nickreese]

Is your feature request related to a problem? Please describe.

I really like what hydrogen does. I'm looking to build a simple static site without client side rendering and there just aren't options that will take a list of paths, data, and a template and render it to an HTML file.

Hydrogen is the closest things I've seen, the only thing it lacks is the ability to explicitly define the template to use... instead it falls back to _index.js in the folder of the routes defined in hydrogen.routes.js.

While this solution works, it doesn't allow the user to use two different templates within the same folder of their site structure.

Such as having both /contact and /about.

Describe the solution you'd like
Reading over how getPages.ts works, I believe it should be doable to allow users to explicitly define the template to use.

Something such as would work well:

  {
    path: "/blogs/setting-up-a-service-worker",
    data: {
      post: 2
    }
   template: "/path/to/template/"
  }

This would allow the user to define their entire site in the hydrogen.routes.js file and then just worry about templates.

[nickreese]

I ended up deciding to roll my own solution to fix the specific use case I have. Thanks.

[shailen-naidoo]

@nickreese Hey man! Sorry for seeing this so late, it has been a very busy start to the year, I like the idea a lot and will include it in the next release 😄

[shailen-naidoo]

@nickreese Hey man! I was just curious about the implementation of this feature

Currently, the Routes API generates an index.html file based on _index.js template, so if you have to point to a template of name _contact.js it would generate /contact.html

 {
    path: "/blogs/setting-up-a-service-worker",
    data: {
      post: 2
    }
   template: "/templates/_contact.js"
  }

would generate /blogs/setting-up-a-service-worker/contact.html, is this the desired outcome that you were thinking about? Or were you thinking of having a templates folder out of pages that you can point to and it would generate /blogs/setting-up-a-service-worker/index.html

The question is how would you handle cases where you want the name of the template to be the output name of the file _contact.js to contact.html 🤔

Can you maybe elaborate on this idea, please?

[nickreese]

Interesting. In my view all pages created should be /path/to/location/index.html. This is the usual way SSGs work so I wouldn’t consider .contact.html to be a feature worth including. Instead just give a path of /contact/ and generate /contact/index.html.

The naming of the template doesn’t seem important, just that it gets the data piped to it and a index.html gets created for that path.

[shailen-naidoo]

@nickreese Thanks for the clarification! That fits with what I was thinking as well. I will add this feature to the board for a future release 😄

Currently, I am planning on rebuilding Hydrogen for modularity