babelify | Browserify transform for Babel | Plugin library

After discussing with the jsdom devs, the answer to my question is that things are working as intended with jsdom in this case. The two supported jsdom use cases are:

• using jsdom as a CommonJS module in Node or
• using jsdom in a Browserify bundle in web browsers

In my case, I'm trying to use jsdom in a Browserify bundle in Node. I will try to use it in a browser and see how I go. Initial tests look promising.

After a lot of researching, I found this blog which has the answer, or almost it has the links to the answer.

One of the links took me to the most detailed tutorial about Gulp + Browserify + Babelify it could ever exist. Here the link. These are a serie of tutorial explaining how to implement Gulp from Scratch. If you don't want to see the videos and just want the code go here.

This is my final gulpfile.js.

And this is the answer to my question:

My formerly build function in gulpfile.js (now called js)

I needed to remove "sideEffects": false from package.json. See the github thread here

You need to add add/install gulp-watch... i dont see it in your package.json. To add it try:

I believe that's the problem is in your package.json simply run npm install and it should work.

Although the command was working fine, it seems there was an syntax errors on how I specify the presets, anyway I have fixed like that:

The example was using twgl 1.x and your gulp is using 4.x, things changed. In particular twgl.drawBufferInfo changed from

If you observe the entire output file rob.js, you will notice that it is actually an IIFE. This means that everything inside rob.js is not going to be visible to the "outside world". You cannot interact with it in this way.

You can either write the entire logic in the "pre-compile" phase, in typescript, or you can use a different bundling system which supports authoring libraries such as webpack

I guess the problem is that Gulp (or some of it's plugins) generates a scaffolding code, necessary for JS's (non-existent) module system, and it often implies wrapping the compiler output into weird multi-layered anonymous functions.

If you don't need any kind of module system and just want your multiple TS files translated directly to a single JS file (which supposedly goes to the RocketChat), then I'd suggest ditching Gulp altogether, letting TSC to compile your code as usual, then bundling the resulting .js files into a single one with a script.

So, the overall setup would be as follows (assuming src is a source code folder):

tsconfig.json