Using webpack compiled library as external in CLJS

Question

I have some legacy code which uses D3 and is compiled with webpack. I'm toying with the idea of porting the D3 bits as external library, and wrapping them as a reagent/re-frame component, yet I have problems importing the JS bits.

I created a small project which demonstrates the problem:

• The JS library code .
• The webpack config used to (UMD) compile it.
• The compiled library (without minify for readability).

Now in a JS project I would use the library like this:

import * as module from 'd3-lib.js'

var m = new module.Module()

m.setData("miserables.json").render();

I tried to mimick that:

• I specify the ns the library provides using foreign-libs in project.clj.

• Import the library.

• Instantiate via the JS-interop

Yet I keep getting:

Uncaught Error: goog.require could not find: d3_lib

Answer 1

Have you tried to use the d3 package from cljsjs ?

Using the cljsjs/d3 package

Add the dependency coordinates [cljsjs/d3 "4.3.0-5"] to the list of :dependencies in your project. Make sure to require cljsjs.d3 somewhere in your project so it is added to your compiled ClojureScript code.

(ns your.namespace (:require [cljsjs.d3]))

You can now use your newly added library by accessing it through the global Javascript namespace, e.g.js/ReactPlease check the project's documentation to find out what global the library uses. Please note: You can not use :as or :refer with CLJSJS dependencies.