Ошибка сборки gatsby undefined - reactcontext

Question

Я использую React createcontext для сохранения глобального состояния - двух отдельных объектов глобального состояния. Он работал в разработке, но не удалось выполнить сборку gatsby.

Я включил GlobalContextProvider как в gatsby-brower. js, так и в gatsby-ssr. js Я не могу включить код, поскольку этот редактор жалуется на «мой сообщение - это в основном код '.

GlobalContextProvider. js

import React from "react"
import moment from "moment"

const initialState = {
  room: 1,
  arrivalDate: moment.utc().startOf("d").format(),
  departureDate: moment.utc().startOf("d").add(1, "days").format(),
  searchResult: false,
  available: false,
  loading: false,
  rate: 0,
  totalNight: 0,
  totalPrice: 0,
}

const initialUserState = {
  email: "",
  password: "",
  error: false,
  errorMessage: "",
  user: "",
  userId: "",
  userName: "",
  loading: false,
  showBookingProceed: false,
}

export const GlobalStateContext = React.createContext(
  initialState,
  initialUserState
)
export const GlobalSetContext = React.createContext()

const GlobalContextProvider = ({ children }) => {
  const [state, setSearchState] = React.useState(initialState)
  const [userState, setUserState] = React.useState(initialUserState)

  return (
    <GlobalStateContext.Provider value={{ state: state, userState: userState }}>
      <GlobalSetContext.Provider
        value={{ setSearchState: setSearchState, setUserState: setUserState }}
      >
        {children}
      </GlobalSetContext.Provider>
    </GlobalStateContext.Provider>
  )
}

export default GlobalContextProvider

макет. js

import React, { useEffect, useContext } from "react"
import classes from "./layout.module.css"
import Header from "./header"
import "./layout.css"
import firebase from "gatsby-plugin-firebase"
import moment from "moment"
import {
  GlobalStateContext,
  GlobalSetContext,
} from "../context/GlobalContextProvider"

const Layout = props => {
  const { userState } = useContext(GlobalStateContext)
  const { setSearchState, setUserState } = useContext(GlobalSetContext)

 ...

  return (
    <div className={classes.container}>
      <div className={classes.content}>
       <Header userState={userState.user} handleLogOut={handleLogOut} />
...

Он жаловался, что пользователь «не определен», но при разработке этого не происходило. Все работает без сбоев.

Был бы признателен за просветление. Спасибо