Hi again friends! The NextJS integration was recently added and since the project I'm working on uses both SST and NextJS I figured I should combine them, but I'm having a slight issue with the environment variables, when trying to deploy it seems that the environment variables that I have configured in the construct are not actually getting injected at all (logging them out during build in NextJS just logs

NEXT_PUBLIC_API_URI: '{{ NEXT_PUBLIC_API_URI }}'

) as such any fetch's that I have in next are throwing a

Only absolute URLs are supported

error. Any help would be greatly appreciated 🙂

The issue is at build time we inject placeholders which are then replaced once the site is fully deployed to to s3/cloudfront

Hmm gotcha, so is there any way to have them injected at build time, in any way, since I use fetch in

getStaticProps

and without it there during build time it doesn't have them

Yeah you might need to rethink your architecture because technically the API values aren't available during build time

environment: {
  NEXT_PUBLIC_API_URI: api.customDomainUrl!,
  NEXT_PUBLIC_CMS_URI: process.env.CMS_URI!,
}

For context this is the only env I have in there

might want to wait to see if @Frank has any ideas, I only have a high level understanding of the nextjs construct

For now I got away with manually setting them in my next config

What I'd suggest is to implement a function that returns the url

@thdxr thanks for jumping on this

@Frank it's primarily being used in getStaticProps

export const getStaticProps: GetStaticProps = async (ctx) => {
  if (process.env.NODE_ENV === "development") {
    //@ts-ignore
    process.env["NODE_TLS_REJECT_UNAUTHORIZED"] = 0;
  }

  let _locale = ctx.locale;
  let topThree = await (
    await fetch(
      `${process.env.NEXT_PUBLIC_CMS_URI}/Reviews?_limit=3&_locale=${_locale}`
    )
  ).json();

  let pageInfo = await (
    await fetch(
      `${process.env.NEXT_PUBLIC_CMS_URI}/home-page?_locale=${_locale}`
    )
  ).json();

  return {
    revalidate: 120,
    props: {
      topThree,
      pageInfo,
    },
  };
};

I see. Unlike

getServerSideProps

,

getStaticProps

needs the values at build time. And reading deployed values at build time is tricky.

Thank you @Frank that makes sense I will look into that 😄