instafluff / ComfyJS

Comfiest Twitch Chat Library for JavaScript | NodeJS + Browser Support
MIT License
405 stars 44 forks source link

Reading .env file to initialize #49

Closed Crazy-Unicooorn closed 1 year ago

Crazy-Unicooorn commented 2 years ago

Hi. I've never coded before, but I decided that creating my own Twitch Chat overlay using ComfyJS would be a great opportunity to start learning. And it was! I have already learned a lot about html, css and js, and I have something functional and looking quite good.

Now, I initialize with this: ComfyJS.Init( 'my_twitch_username' ); but I wanted to go a step further and start sending messages. For this, I need to add some kind of authentification key, and the documentation says to use a .env file for this. So I went ahead creating such file, and replacing my initialization with ComfyJS.Init( process.env.TWITCHUSER, process.env.OAUTH ); Then I realized it was not going to be that easy, and that I needed a lot more steps for this to work (remember, I know nothing about code).

So I followed this tutorial: https://www.youtube.com/watch?v=vSmzEGZQI5A I installed lots of packages like webpack dotenv-webpack and things like that. I created and configurated a package.json, a webpack.config.js, put the index.html, app.js and style.css files that I already had, in a "src" folder [...] and some more steps (following the tutorial).

Once everything is setup correctly and I double check everything, I run my index with a live server like I usually do, and it doesn't work. It feels like my app.js still is unable to "read" the .env file. So instead I try to run a serve command like in the tutorial, and I am not even able to do that. It doesn't open a local webpage, instead I get an error in the terminal.

So I guess what I need is some kind of documentation to follow, to figure out how to use a .env file with ComfyJS and have it working in my live server for test purposes, and in my Streamlabs to add my ComfyJS overlays.

Crazy-Unicooorn commented 1 year ago

I've figured this is because I can't use dotenv in browser app or something like that. I've been able to work around it and everything is fine now. I've played a lot with the library and it's awesome :)

If someone still can answer on how to use "dotenv" (and "require") in a file destined for OBS as a browser source, please let me know.