How to expose your App to the DOM with Webpack

A quick trick to expose your app to the DOM when using Webpack


Published 2 years ago

Say I wanted to access this class from the DOM.

export class Derp
    constructor(private cool: string, private runnings: string)
        console.log("Hello", cool + " " + runnings);

Update your Webpack config to include the following under library and libraryTarget. Set library to whatever you like.

        output: {
            library: "Awesome",
            libraryTarget: "var"

Now when your Webpack bundle has compiled, you will be able to access Awesome in the DOM and everything within. It means you could then write:

new Awesome.Derp("derp", "herp")