Request: provide clear example on creating non-trivial UMD bundles

Current Behavior

There is no guidance on how to include/exclude imported modules into a UMD bundle. I have spent a whole day playing around with tsdx.config.js and rollup plugins trying to make it work. I find both the rollup-plugin documentation and tsdx documentation lacking. By comparison, I have found it straightforward in the past to create UMDs with webpack.

Desired Behavior

Here is my code, which includes a tsdx.config.js file. I want to be able to build a working UMD bundle when I run ./_build_all (a wrapper around tsdx build --format umd). I also want to be able to control what gets bundled into the UMD. The 3rd party dependencies imported into my code are:

import React, { useState, useEffect, useRef } from 'react';
import * as THREE from 'three';
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';
import { TrackballControls } from 'three/examples/jsm/controls/TrackballControls';

For the UMD, I’d like the OrbitControls and TrackballControls bundled, but Three and React can be externalized.

Suggested Solution

Please show me how to configure my tsdx.config.js file to achieve my stated ends, and then consider including this as an example in your codebase to help others.

Who does this impact? Who is this for?

Anyone who is trying to create a non-trivial UMD bundle will benefit from a clear example of a codebase with various dependencies where some need to be bundled, and some need to be excluded.

Describe alternatives you’ve considered

Abandon tsdx/rollup altogether and start again using webpack 5.

[agilgur5]

While I spent quite a bit of time responding, OP has not followed up… Closing as stale

[d-w-d]

Sorry – been busy and not able to get back to this. Thanks very much for your responses – they were very helpful. In particular, I found that your module.exports = { … } suggestion worked.