@shopify/react-web-worker does not work with CRA

[piechnat]

When trying to use @shopify/react-web-worker I get the following error:

./node_modules/@shopify/react-web-worker/build/esm/hooks.mjs
Can't import the named export 'terminate' from non EcmaScript module (only default export is available)

[stsiarzhanau]

The same thing with @shopify/react-form... I have a CRA typescript project. And on attempt to import useForm hook get the following error:

./node_modules/@shopify/react-form/build/esm/validation/validator.mjs Can't import the named export 'isEmpty' from non EcmaScript module (only default export is available)

[sklinov]

@piechnat If you have ejected from CRA it will be a bit easier, but you'll need to override your webpack config (using react-app-rewired or similar tools)

So in webpack.config.js you need to add this

module:
{
 ...,
 rules: [
  ...
  {
    test: /\.(mjs)$/,
    include: /node_modules/,
    type: "javascript/auto",
   },
  ...
  ]
}

And don't forget to remove mjs extension from other test rules

[BPScott]

It might be worth trying again with the latest versions of these packages. #2082 fixed up some issues with the accidental inclusion of non-esm files in the esm builds.

[afzalsayed96]

Still the same

[makis-spy]

Would be nice to have a big fat disclaimer somewhere "Does not work with CRA" :)