"Invariant Violation" When compiling with gatsby.

[rolandpeelen]

See full error output here: https://gist.github.com/rolandpeelen/9cd9a21e407792df72986f9058a8a46a

Reason: https://gist.github.com/rolandpeelen/05830742a70a362b1c77699e91b57559 Compiled JS: https://gist.github.com/rolandpeelen/cb91143c44e2472a866eb9376f03edf6

When I try to run the gatsby build, I get a very cryptic error. I figured perhaps you guys would have seen this before? Maybe I'm running into some inherent problem with Gatsby, but I'm unsure what that would be.

[rolandpeelen]

Nevermind; I found it;

https://github.com/gatsbyjs/gatsby/issues/11225#issuecomment-457211628

When doing serverside rendering with gatsby, there is no 'fetch', as this is a browser api. So we should pass it into the constructor. For future reference:

In my case, in the gatsby-ssr and gatsby-browser wrap the root element by using a function coming from Reason land;

import "normalize.css"
import "./src/root.css"

import { wrapElement } from "./src/Root.bs"

export const wrapRootElement = ({ element }) => wrapElement(element)

Not the second argument for the http link and the external module.

[@bs.module "isomorphic-fetch"] external fetch : ApolloClient.fetch = "";

/* Create an InMemoryCache */
let inMemoryCache = ApolloInMemoryCache.createInMemoryCache();

/* Create an HTTP Link */
let httpLink =
  ApolloLinks.createHttpLink(
    ~uri="our-epic-api",
    ~fetch,
    (),
  );

let client =
  ReasonApollo.createApolloClient(~link=httpLink, ~cache=inMemoryCache, ());

let wrapElement = (~element) =>
  <ReasonApollo.Provider client>
    <ApolloHooks.Provider client> element </ApolloHooks.Provider>
  </ReasonApollo.Provider>;

[fakenickels]

Glad you found!