[question] Using objects as template placeholders

Hi,

I was trying out preval with NextJS to inline my data during build time.

This is my code:

static async getInitialProps() {
    const { data } = await Axios.get(
      "http://localhost:3100/graphql?query={ articles{ name slug } }"
    );
// data.data is an object
    const actualData = preval`
    const allArticles = ${data.data}
    module.exports = allArticles
    `;
    console.log(actualData);
    return { data };
  }

When I console log it, it returns an empty object. Am I doing something wrong here?

[kentcdodds]

Ah, that’s tricky. What would probably be best is to have a script that loads the data into a cache before the build so you can get it synchronously during the build.

But if that doesn’t work, your code can do spawn.sync to run an asynchronous script synchronously. But that would make your build pretty slow.

[garnerp]

Hi @kentcdodds .

The use case @rtm619 is trying to achieve is to inline the data when doing a next.js export, that way when the site is served from the exported files that the getInitialProps function is returning the inlined content instead of going to the API. I think the problem is that preval only supports sync and the call here is async. Any ideas how to potentially do this using preval?