ClojureScript with Webpack

This page documents how to use Webpack and externs
inference to easily integrate popular libraries from the JavaScript ecosystem
into your ClojureScript project. You should have Node.js and
yarn installed. This guide assumes you have read through the
Quick Start. This guide borrows liberally from this
excellent
guide on Webpack 2.

We turn on externs inference and we disable reading from node_modules since
we’re managing that on our own. We then state what our foreign lib provides
and what global JavaScript variables will have the library objects. This is why
we exported to window in index.js. Note that our foreign library can provide
as many libraries as we like and we can define exactly where they will be found.
This also allows us to use foreign libraries as if they were normal
ClojureScript namespaces. However, ClojureScript knows these are foreign libraries
and will treat any function calls and property accesses as things to be considered
for externing.

Let’s see this in action.

clj -m cljs.main -co build.edn -v -c

Let’s verify that it worked:

clj -m cljs.main -s

Open your browser to http://localhost:9000. Open the Developer Console, you
should see that React.Component got logged.

Check out/inferred_externs.js. You should see that Object.Component was
inferred.

Overriding a Foreign Library

Occasionally you may find that you need to provide a custom build of React but
you still want to use some ClojureScript React binding like Reagent.
ClojureScript supports this out of the box.