Search code examples
reactjsreact-hooksgatsbynetlify

pageContext array not accessible on netlify build


I don’t know why I can read this pageContext array content only locally but not on build

I can access to the entire array but I can’t access to the single element inside id:

2:09:56 PM: error Cannot read properties of undefined (reading '0')
2:09:56 PM:   TypeError: Cannot read properties of undefined (reading '0')

indexTemplate.js

import React, {useState} from 'react'
import Layout from "../../components/Layout"


const IndexPage = ({data, pageContext}) => {
  const sliderRef = useRef();
  const {slideshow} = pageContext;
    return (
      <Layout >
          {typeof slideshow} 
/*
output:

Array(3)
   0: {duration: 4}
   1: {duration: 3}
   2: {duration: 2}
length: 3
[[Prototype]]: Array(0)
*/
         {typeof slideshow[0].duration}
/*
on NETLIFY build:
TypeError: Cannot read properties of undefined (reading '0')
*/

      </Layout>
    )
  }
export default IndexPage;

p.s. locally it works


Solution

  • The problem was that I use Gatsby for this project and that file was in /pages directory.

    src  
    └───pages
    │   │   index.md
    │   │   index.js 
    

    pages directory work in development mode in build mode works only if page files are in /template or different folder:

    src  
    └───pages
    │   │   index.md
    └───templates
        │   index.js