# ZOOM WebSDK/React Clash **URL:** \ **Category:** Web\ **Created:** [April 16, 2020, 4:34am UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432 "2020-04-16T04:34:33Z")\ **Posts on this page:** 15\ **Page:** 1
**Author:** ![salil](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/salil/32/3930_2.png) [@salil](https://devforum.zoom.us/u/salil)\ **Post date:** [April 16, 2020, 4:34am UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/1 "2020-04-16T04:34:33Z")
**Description** I’m trying to integrate the Zoom Web SDK into my existing React app and the moment I call the ZoomMtg pre-init functions (preLoadWasm and prepareJssdk), I get an error. I’m guessing this has to do with the WebSDK needing a different version of React. We are using 16.10.2 in the project. I would think that npm should not have installed React inside the Zoom WebSDK npm given the root project already depends on React but maybe the version requirements are different? Any help would be appreciated. **Error** Uncaught Invariant Violation: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons: 1. You might have mismatching versions of React and the renderer (such as React DOM) 2. You might be breaking the Rules of Hooks 3. You might have more than one copy of React in the same app See [https://fb.me/react-invalid-hook-call](https://fb.me/react-invalid-hook-call) for tips about how to debug and fix this problem. at invariant (webpack-internal:///./node\_modules/@zoomus/websdk/node\_modules/react/cjs/react.development.js:88:15) at resolveDispatcher (webpack-internal:///./node\_modules/@zoomus/websdk/node\_modules/react/cjs/react.development.js:1436:28) at useMemo (webpack- **Which version?** Zoom WebSDK 1.7.5 ---
**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\ **Post date:** [April 16, 2020, 10:45pm UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/2 "2020-04-16T22:45:18Z")
Hey @salil, First time I am seeing this error. Are you including the `ZoomMtg.setZoomJSLib()` function before the pre init functions? ![Screen Shot 2020-04-16 at 4.44.55 PM](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/2X/8/8ba9998dac433dacfaa0353815d26d3614f16586.png) > **[@zoomus/websdk](https://www.npmjs.com/package/@zoomus/websdk#usage)** > > Zoom Web SDK > Thanks, Tommy ---
**Author:** ![salil](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/salil/32/3930_2.png) [@salil](https://devforum.zoom.us/u/salil)\ **Post date:** [April 17, 2020, 7:05pm UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/3 "2020-04-17T19:05:49Z")
So I’ve definitely done that but I’m still seeing the error. Is there a reason why `react` and its ilk are declared as `dependencies` in addition to `peerDependencies` in Zoom WebSDK’s `package.json`? I’m far from a Node expert but my understanding is that since the Zoom WebSDK functions as a “plugin” (in `npm` parlance) that its dependencies should only be listed as `peerDependencies` to avoid library version clashes. Also, as to your original point about the `setZoomJSLib` call, for local development, I’ve got a static http server running to serve up the requisite files. However, this approach seems to run contrary to how node+webpack would prefer things to be done. I’d love for the dependencies to be included at build time rather than included at runtime. What’s the preferred way of making that happen? I’m guessing it has to do with the line “The following directory (already in node\_modules) must be accessible in your url path” but I’m not sure I follow what that means. Thanks for the help Tommy and stay safe! ---
**Author:** ![klinton](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/klinton/32/6522_2.png) [@klinton](https://devforum.zoom.us/u/klinton)\ **Post date:** [April 20, 2020, 8:33am UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/4 "2020-04-20T08:33:11Z")
I am also having the same issue with react hooks. Anyone have fix on this? please? ---
**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\ **Post date:** [April 21, 2020, 10:18am UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/5 "2020-04-21T10:18:54Z")
Hey @salil, @klinton, @michael.zoom (our react expert), will help with this! 🙂 Thanks, Tommy ---
**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\ **Post date:** [April 21, 2020, 10:10pm UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/7 "2020-04-21T22:10:51Z")
Hey @salil, @klinton, Can you create a simple react app in a GitHub repo that we can clone and see the issue and debug from there? Thanks, Tommy ---
**Author:** ![klinton](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/klinton/32/6522_2.png) [@klinton](https://devforum.zoom.us/u/klinton)\ **Post date:** [April 22, 2020, 1:23am UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/8 "2020-04-22T01:23:14Z")
Ok ill give the link today 😃 . Thank you very much for the reply. 😃. I’m currently on Laravel vue project on this one, installed react and react-dom also. However I’m having that error with black screen. ---
**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\ **Post date:** [April 23, 2020, 12:53am UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/10 "2020-04-23T00:53:08Z")
Thanks @klinton! 🙂 -Tommy ---
**Author:** ![shahkhalid.me](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/shahkhalid.me/32/12107_2.png) [@shahkhalid.me](https://devforum.zoom.us/u/shahkhalid.me)\ **Post date:** [July 18, 2020, 7:09am UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/11 "2020-07-18T07:09:40Z")
Here is the working example [https://github.com/shkhalid/zoom-web-sdk-react-example](https://github.com/shkhalid/zoom-web-sdk-react-example) ---
**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\ **Post date:** [July 21, 2020, 9:49pm UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/12 "2020-07-21T21:49:55Z")
Thanks for sharing that example @shahkhalid.me! 🙂 -Tommy ---
**Author:** ![peter.kelevra](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/peter.kelevra/32/22830_2.png) [@peter.kelevra](https://devforum.zoom.us/u/peter.kelevra)\ **Post date:** [February 9, 2021, 2:09pm UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/13 "2021-02-09T14:09:29Z")
I had the same problem as @salil I solved it using the same version of react that @zoomus/websdk uses. In my case. @zoomus/websdk version 1.9.0 which uses react 16.8.6. ---
**Author:** ![will.zoom](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/will.zoom/32/14417_2.png) [@will.zoom](https://devforum.zoom.us/u/will.zoom)\ **Post date:** [February 10, 2021, 2:22pm UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/14 "2021-02-10T14:22:58Z")
Thanks for sharing, @peter.kelevra ! 🙂 ---
**Author:** ![kurt2](https://avatars.discourse-cdn.com/v4/letter/k/58956e/32.png) [@kurt2](https://devforum.zoom.us/u/kurt2)\ **Post date:** [November 2, 2021, 11:59pm UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/16 "2021-11-02T23:59:40Z")
Is the expectation here to change the React version of the application invoking Zoom sdk to what Zoom uses? Is there a more plausible solution? Could some aliasing solution be done within the library? ---
**Author:** ![MaxM](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/maxm/32/42303_2.png) [@MaxM](https://devforum.zoom.us/u/MaxM)\ **Post date:** [November 5, 2021, 8:23pm UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/17 "2021-11-05T20:23:47Z")
Hey @kurt2, Thank you for reaching out to the Zoom Developer Forum. For the most part, you’ll want to align the versions of react used by your project and the Zoom SDK to avoid any conflicts. If you would like to see this dependency removed or aliased, I recommend posting in the [#feature-requests](https://devforum.zoom.us/c/feature-requests/23) category. Thanks, Max ---
**Author:** ![MaxM](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/maxm/32/42303_2.png) [@MaxM](https://devforum.zoom.us/u/MaxM)\ **Post date:** [November 5, 2021, 8:23pm UTC](https://devforum.zoom.us/t/zoom-websdk-react-clash/13432/18 "2021-11-05T20:23:52Z")