Demonstration of the "double-bundle" approach to integrating NPM dependencies into ClojureScript projects
This repository is no longer maintained. Please refer to the cljs-spa-example project instead.
You can integrate NPM dependencies in a Clojurescript project by building a separate bundle using webpack. The resulting application contains two bundles:
js/npm-bundle.js, built by webpack
js/compiled/double_bundle.js, built by the Clojurescript compiler (and Google Closure)
Hence the name - the double bundle approach.
This project is built on Reagent and Figwheel. Note, however, that neither of these are essential - a similar approach would work for any browser-based Clojurescript project that consumes NPM dependencies.
To show how to include third party React dependencies, this project includes the react-datetime calendar component.
To see the demo, run this:
yarn install yarn build lein figwheel
Then open your browser at localhost:3449.
This project is based on fighweel-template. To see the changes from an empty fighwheel template, see this diff view.
For simplicity, we're not making use of the
npm-deps feature included in recent versions of the Clojurescript compiler here. The Google Closure compiler is not involved. The upside of this choice is that any NPM packages should work, as long as it is added to
Similarly, for the sake of operational simplicity, we don't provide an externs files for an external component. Instead, we use
goog.object/get to retrieve the component while avoiding minification during Advanced Compilation.
- Show how to build a single prod bundle
- Does Reagent require externs in advanced compilation?
Copyright © 2017 Paulus Esterhazy
Distributed under the Eclipse Public License either version 1.0 or (at your option) any later version.