How to expose your App to the DOM with Webpack

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

webpack

Published 4 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")

Let's chat about your next project

Whether you're looking for a single contractor or a full team, I regularly collaborate with a trusted collective of designers and developers to deliver large-scale projects.

See also...

KickTown Football

Website Development for KickTown Football: Custom Build, Merchandise Store, and Booking System

Stock Investment App

Mobile and web app for stock investment, built with TypeScript, React, and WebSockets, offering real-time data and responsive design.

CnCNet - Website & App Development

Comprehensive design and development of web and desktop apps for CnCNet

Bespoke AR Web Configurator for E-Bikes

A bespoke augmented reality web configurator developed to showcase the client's E-Bike, offering fully customizable options such as color selections and feature configurations.

Oriental Garden Restaurant

A complete website redesign featuring a new online ordering system for enhanced customer experience and increased revenue.

Web App Visualizer - Facial Cosmetic Treatment Simulation

A React and TypeScript-powered web app designed to visualize facial cosmetic treatment results for enhanced customer decision-making

React Native - Android & iOS App

Development of a bespoke Android & iOS app for a Health technology startup, built with React Native & TypeScript.

Website - C&C Community

Enhancing the platform with a sleek user interface, improved SEO coverage, and integrated content features like Twitch, and Steam. Offering a central resource for Command & Conquer fans and creators.