prerender file that returns a promise and passes props to route

[wulfmann]

Do you want to request a feature or report a bug?

Feature

What is the current behaviour?

Hardcoded values

If this is a feature request, what is motivation or use case for changing the behaviour?

I would like to be able to return a promise / route list (like is currently supported) to preact build and have arbitrary props passed to the route.

This would allow me to fetch data from an api to allow for a fully rendered build without js (potentially).

---

Api idea:

Example Gist: https://gist.github.com/wulfmann/258bc8189ea246ba1e18bdc5797b2c98

Is this something that has been considered or is already being worked on? I would be willing to work on a solution, just wanted to hear your thoughts! @developit

[wulfmann]

Some similar ideas in other projects:

Next: https://nextjs.org/learn/excel/static-html-export/exporting-other-pages

Nuxt: https://nuxtjs.org/api/configuration-generate/#speeding-up-dynamic-route-generation-with-code-payload-code-

Gatsby: https://www.gatsbyjs.org/tutorial/part-seven/

[wulfmann]

I think preact (and preact-cli) are especially handy for small projects (a few pages) and in cases where data isn't updated very often, i'd love to utilize it more of as a generator.

I imagine you could do something like this with webpack but I wanted to see if you would be interested in extending the prerender feature.

[prateekbh]

Yes we definitely want this. This was also once suggested by @developit

The main idea is to enable prerender-urls.js to have a default export of a function which could return a promise.

This promise can then resolve with a json value that we expect today.

That should be cover the abovesaid requirements, right?

[wulfmann]

@prateekbh That solves the first half of what I was suggesting. Is there currently a way to pass props to the route via the json object? I wasn't able to get that to do anything when I tried it.

[prateekbh]

See #430

[prateekbh]

// @lukeed

[wulfmann]

@prateekbh If you look at the gist i linked, you will see the usage I had in my head.

I was more thinking of passing actual props to the component being rendered itself, rather than interpolating the value into the template.

This obviously just may not be possible, but it would be pretty cool.

[prateekbh]

@wulfmann the gist exactly aligns with what we expect the shape of API

function():<Promise<Array<Object{url, title,.....}>>>

IIRC these props does gets passed to the actual component, may be I am wrong

[wulfmann]

@prateekbh The only reason I inferred that it doesn't was your reference to #430

Just wanted to voice that it would be a cool feature, if it already does then great. No matter what i'm loving preact and preact-cli and would love to help any way i can.

[ForsakenHarmony]

next currently has the option of using prerender-urls.js but you can't use a promise yet, only

function(): Array<{ url, title, ... }>

[wulfmann]

@ForsakenHarmony Can you confirm that the ... in your example are passed as props to the component, or is it just available for interpolation into the template file?

[ForsakenHarmony]

oh it seems we only pass url as a prop, interesting

[wulfmann]

are you referring to this line?

https://github.com/developit/preact-cli/blob/b9fe7871faeb7dd24373f8b387735346c8b66b49/src/lib/webpack/prerender.js#L29

I messed around locally with changing that but I didn't spend much time on it. I'd be happy to put a PR into next if I get it working with minimal changes. Or is this something that's already in the works?

[prateekbh]

Nups, feel free to PR

[ForsakenHarmony]

You might want to do it for the next branch though

[wulfmann]

@ForsakenHarmony @prateekbh I added an initial PR. Please let me know what you think.

You will see here that in order for this to work, you need to pass all props to the route itself. Do either of you have any ideas on how to make that a better experience, or do you like that?

Thanks!

[prateekbh]

@wulfmann can this be closed now?

[ForsakenHarmony]

still no promise support

[wulfmann]

The promise would be nice so that data from a service could be supported, but the second half of this issue can be closed. I'm ok with closing it and reopening after the next major release.

[ForsakenHarmony]

Well you can also open a new issue just for the promise support if you want