Modularizing plotly

plotly.js
1

I am building a react app using plotly and it’s working fine.
But at 2.2 mb, the plotly min file is huge.
To reduce the bundle size, I followed the modularising documentation in the following



This is what I have done so far…
Downloaded the 1.5 zip file and unpacked in my assets
Added the following code
import * as PlotlyCore from '…/plotly.js/lib/core’
import * as PlotlyHistogram from '…/plotly.js/lib/histogram’
const customPlotly = PlotlyCore.register(PlotlyHistogram)

After all this customPlotly is still undefined.
I console logged PlotlyCore and PlotlyHistogram and they look as they should.

Am I missing something here?
Help much appreciate. Thanks

2

PlotlyCore.register doesn’t return anything. If you export PlotlyCore instead of that customPlotly variable, things should work.

3

Thanks for prompt response etienne.
Mostly because I am just dumb, but it is still not working.
Before I put this thing in a separate module, I just wanted to try it first.

If I understand you correctly, the following should work right?
PlotlyCore.register(PlotlyHistogram).plot(‘plothist’, data, layout, defaultPlotlyConfiguration);

I am exporting PlotlyCore as you mentioned and it works as it shows in console
import * as PlotlyCore from '…/plotly.js/lib/core’
import * as PlotlyHistogram from ‘…/plotly.js/lib/histogram’

And then I do
PlotlyCore.register(PlotlyHistogram).plot('plothist', data, layout, defaultPlotlyConfiguration);

Doesn’t work.

Also, https://plot.ly/javascript/modularizing-monolithic-javascript-projects/
tells me to export customPlotly

var plotlyCore = require('plotly.js/lib/core');
var plotlyBar = require('plotly.js/lib/bar');

var customPlotly = plotlyCore.register(plotlyBar);

module.exports = customPlotly;

I am sure I am missing something very simple but probably I am not the only one.
Thanks

4

What about:

PlotlyCore.register(PlotlyHistogram)
PlotlyCore.plot('plothist', data, layout, defaultPlotlyConfiguration);

?

1 Like
5

Aah…that works :smile:
It messed up my chart a bit though. But I am happy to fix that later.
Thanks much buddy. Much appreciated

1 Like