August 10, 2017 · clojurescript webpack frontend

Import clojurescript into ES6 module

In case you have a clojurescript codebase and you want to use it in your ES6 project. Sadly exports-loader does not work with it out of the box. Here's what to do.

Mark exported functions using ^:export metadata.
;; algo/core.cljs
(defn ^:export answer
  [nums]
  (solve nums))

This way you can call this function using using its module path algo.core.answer([1, 2, 3]).

Compile your library using lein do clean, cljsbuild once min

Now your cljs code are compiled to js wrapped using a immediate called function like this.

(function (){
// export module to this, 
})();

This does not properly pass module context to inner function. We need to make some modification to that compiled javascript.

Modify this exported javascript file to pass a context object to the inner function
(function (){
// add stuff to this, 
}).call(exports);
Import your clojurescript library using ES6 import
import algo from 'exports?exports.algo.core!./algo';

Remember to install exports-loader with npm install --save-dev exports-loader

  • LinkedIn
  • Tumblr
  • Reddit
  • Google+
  • Pinterest
  • Pocket