I repeatedly get this message and I am trying to include the d3.js into my distribution file.
Treating 'd3.js' as external dependency
I've tried using this plugin
import includePaths from 'rollup-plugin-includepaths';
var includePathOptions = {
paths: ['node_modules/d3/d3.min.js'],
include: {
d3: 'd3'
},
};
what am i missing?
Note: This is for d3js v4 (I'm not sure its possible with v3)
You need to use rollup-plugin-node-resolve to make rollup aware of dependencies in node_modules.
You install it via npm install --save-dev rollup-plugin-node-resolve
(Note: I'm new to all this, the babel plugin might not be necessary)
rollup.config.js
import babel from 'rollup-plugin-babel';
import nodeResolve from 'rollup-plugin-node-resolve';
export default {
entry: 'path/to/your/entry.js',
format: 'umd',
plugins: [
babel(),
nodeResolve({
// use jsnext:main if possible
// see https://github.com/rollup/rollup/wiki/jsnext:main
jsnext: true
})
],
sourceMap: true,
dest: 'path/to/your/dest.js'
};
It's necessary to use jsnext:main otherwise you will get errors like Export '<function>' is not defined by 'path/to/node_module/file.js'
Taken from a post on integrate with rollup and es2015
This is also documented in rollup issue #473 (note it refers to the old name of this plugin rollup-plugin-npm)
Then you can run rollup via rollup -c
You also need to roll your own d3 module with just the bits you need. That way you can still use examples from the web with d3.* prefixes. I was originally importing the relevant bits into my client code but there is no way to merge all these into one namespace.
Start with d3 master module and paste all the exports that you need in your code into a local ./d3.js file
Example roll-your-own d3.js
/*
re-export https://github.com/d3/d3/blob/master/index.js for custom d3 implementation.
Include only the stuff that you need.
*/
export {
ascending
} from 'd3-array';
export {
nest,
map
} from 'd3-collection';
export {
csv, json
} from 'd3-request';
export {
hierarchy,
tree
} from 'd3-hierarchy';
export {
select
} from 'd3-selection';
Import your hand rolled d3
import * as d3 from ./d3
As you import more of d3 you only need to keep your ./d3.js in sync and your client code won't care.
Remember you will need to re-run rollup after any changes.
