Cant get this to work with React.JS

[stuhowarth]

Hey,

Im looking to get this working with React.js but each time the app starts I get a module error:

Module not found: Error: Can't resolve 'dgram'

dgram is a Node.js module not designed to be run in a browser and I have tried to get alternatives such as dgram-browserfy but failed at that. Has anybody got this working with React at all and if so any help would be greatly appreciated. Or am I simply trying to achieve the impossible?

Cheers Stu

[stuhowarth]

I did manage to get rid of the dgram issues through various plugins and altering webpack fallbacks to use the alternative modules such as dgram-browserify, https-browserify. These errors did disappear but then I was getting another error, unfortunately I've been doing lots of testing and removed all the packages I added so its hard for me to get back to that particular error but it was something to do with socket-io (This is used to shim the dgram stuff etc within a browser). I'm thinking what I am trying to do just isn't possible but maybe others have managed to do it. Its not the end of the world as I can access the HUE API's, I just liked the idea this can access the bridge remotely as this is a feature we would like for our solution. If anybody can help then great :)

[peter-murray]

What version of the library are you using when you get this error?

I have made a number of changes to move the dgram discovery aspect out in to a separate part of the library that you can import to avoid the Node.js specific stuff when operating in the browser.

There is a way to import only the API aspects and avoid the discovery part of the library (which is useless in the browser) but this separate could only be done in a breaking change, so requires a major version number bump, which was version 5.x.

You are going to need to avoid the direct import of the library and instead only import the api part of the library to achieve what you want as the v3 and default index import (without filtering) will try to bring in the discovery parts for backwards compatibility.

Now that the library is in TypeScript that might be more complex as it might be implicitly pulling in the discovery parts by mistake, so if you can provide an example of what you are doing to generate the problem, I can work on fixing that if there is still an issue in this space.