ERROR in ./node_modules/ts-invariant/process/index.js 29:11-18

[appasaheb4]

latest react and apollo client facing issue.

[jpvajda]

@appasaheb4 Thanks for reporting this, can you provide more details around this problem? We like to capture the following in issues so we can better triage them (this is from our github issue template)

**Intended outcome:**
<!--
What you were trying to accomplish when the bug occurred, and as much code as possible related to the source of the problem.
-->

**Actual outcome:**
<!--
A description of what actually happened, including a screenshot or copy-paste of any related error messages, logs, or other output that might be related. Places to look for information include your browser console, server console, and network logs. Please avoid non-specific phrases like “didn’t work” or “broke”.
-->

**How to reproduce the issue:**
<!--
If possible, please create a reproduction using https://github.com/apollographql/react-apollo-error-template and link to it here. If you prefer an in-browser way to create reproduction, try: https://codesandbox.io/s/github/apollographql/react-apollo-error-template

Instructions for how the issue can be reproduced by a maintainer or contributor. Be as specific as possible, and only mention what is necessary to reproduce the bug. If possible, try to isolate the exact circumstances in which the bug occurs and avoid speculation over what the cause might be.
-->

**Versions**
<!--
Run the following command in your project directory, and paste its (automatically copied to clipboard) results here:

`npx envinfo@latest --preset apollo --clipboard`
-->

[SamsonChoo]

I am facing the same issue, using React 18, installed @apollo/client through npm, tried to run file, below error returned:

ERROR in ./node_modules/ts-invariant/process/index.js 29:11-18
Module not found: Error: Can't resolve 'process/browser' in 'C:\Users\Samson\work\MyAppNameHere\node_modules\ts-invariant\process'
Did you mean 'browser.js'?
BREAKING CHANGE: The request 'process/browser' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.

[poppywu]

Same error here, using React 17, @apollo/client 3.6.9. Tried:

• Add process as Devdependencies but no luck
• Add process/browser to webpack 5 ProvidePlugin but still no luck Appreciate any help!

[otegami]

Hi, in my case I'm using webpack5 and React17, I have the same problem. So I've just fixed it like this and it works. Actually I don't understand why It works. So please tell me it if someone know it.

Before

// webpack.config.js
plugins: [
    new webpack.ProvidePlugin({
      process: 'process/browser',
    }),

After

// webpack.config.js
plugins: [
    new webpack.ProvidePlugin({
      process: 'process/browser.js',
    }),