nextJS CSR GetStaticProps

Question

In my nextjs app, the assets and data for CSR is located in the public folder. I dont get any results when fetching from 'public/api/info.json'.

My code:

import type { GetStaticProps } from 'next'

export const Info: React.FC = ({ info }: any) => {
  console.log(info)
  return <section>
//code
  </section>;
};

export const getStaticProps: GetStaticProps = async (context) => {
  const res = await fetch("/api/info.json");
  const data = await res.json();
console.log(data)

  return {
    props: {
      info: data,
    }
  }
}

Answer 1

Is there anything output in the terminal for the server side console log?

Either way,

Try using the filesystem and reading the file like so:

import fs from "fs"; // import at top of file
....


export const getStaticProps: GetStaticProps = async (context) => {
  const apiDirectory = path.join(process.cwd(), "public/api");
  const info = fs.readFileSync(path.join(apiDirectory, "info.json"), "utf8");


  return {
    props: {
      info,
    }
  }
}