Importing Typescript modules in renderer

Question

I'm attempting to import Typescript classes in the renderer process of Electron.

The issue I have is that I cannot use the "import" keyword in the Renderer process. This is because I can't use commonJS as the module importer on the client side, only the server side.

I am at a loss for how I can import these classes that I've exported.

I made a gist trying to explain https://gist.github.com/kvikende/0fb762e38fc0d1bfe1aebf786fd2ca59

Tldr: import keyword fails with "Uncaught ReferenceError: exports is not defined". Using const dataset = require("./dataset"); doesnt actually import my exported classes.

What am I missing?

Answer 1

When I'm writing a module that will be used both on the client and the server, I use the module flag to compile the module in UMD format:

tsc --module umd app.ts

You can then use standard imports:

import * as MyModule from './MyModule';

And they will work with both commonjs and AMD module loaders (for example, you could use require.js in your browser).