"ReferenceError: setImmediate is not defined" occurs when query data.

[sunjae-kim]

Hi, I am using Next.js due to SSR.

Using node version 12.14.0 and below is my code.

import React, { useState, useEffect } from 'react';
import { withWebId } from '@solid/react';
import data from '@solid/query-ldflex';

const MyPage = ({ webId }) => {
  const [name, setName] = useState('');

  const getProfileData = async () => {
    const user = data[webId];
    const nameLd = await user.vcard_fn;
    setName(nameLd.value);
  };

  useEffect(() => {
    if (webId) getProfileData();
  }, [webId]);

  return (
    <div>
      <p>Your Web Id is {webId}</p>
      <p>Your name is {name}</p>
    </div>
  );
};

export default withWebId(MyPage);

Sometimes it works, but the most of the time it gives ReferenceError: setImmediate is not defined.

Is there any solution for this?

[RubenVerborgh]

Using node version 12.14.0

From the screenshot it appears you are using a browser though 🙂

Did you webpack your code?

[sunjae-kim]

Yes I webpacked my code and opened it with browser.

[RubenVerborgh]

Then I will need your webpack config, because webpack is supposed to inject setImmediate.

[sunjae-kim]

Thank you Ruben!

I found that setImmediate was set to false in my webpack setting.

Just added below code in next.config.js, it worked like a charm 😀

webpack(config, options) {
  config.node.setImmediate = true;
  ...
}

[RubenVerborgh]

Super!