Package broken when installing in JSPM

[lyschoening]

Not that plotly would necessarily have to support JSPM, but it's also not possible to shim around the issue because there is neither a true source nor a true distribution format in the NPM package.

The package.json points to src/index.js, which relies on build/ploticon and other files in the build folder. Meanwhile, dist/plotly.js – presumably intended for distribution given the name – begins with var Plotly = require('../src/plotly'); which seems wrong.

[Hypercubed]

After this #18 is merged dist/plotly.js should work in JSPM.

Run jspm install plotlyjs=github:plotly/plotly.js then import using import Plotly from 'plotlyjs/dist/plotly';

Note: Not at the my work computer now so I may have missed something

[etpinard]

We'll make sure the dist/plotly.js import will work in the next release.

[etpinard]

Should be fixed in v1.1.0.

Can you confirm? (I'm having a hard time setting up jspm for some reason).

[lyschoening]

Hi @etpinard. I gave it another try. Unfortunately it doesn't work yet.

The primary issues I am seeing right now:

1. There are sill plenty of require() lookups in the dist/ version that refer to paths in the src/ version (some with incorrect paths):
   • var Plotly = require("../src/plotly");
   • require("../../plots/cartesian/layout_attributes");
   • etc.
2. The list of dependencies in package.json is incomplete. (I assume this works in Node because some of its other dependencies may also 'happen' to have them as dependencies). You require at least the following packages from within plotly.js, without listing them as dependencies:
   • cubic-hermite
   • binary-search-bounds.
   • mat4-interpolate
   • gl-vec3
   • mat4-recompose
   • quat-slerp
   • filtered-vector
   • turntable-camera-controller
   • orbit-camera-controller
   • matrix-camera-contoller
   • alpha-complex
   • simplicial-complex-boundary
   • circumradius
   • circumcenter
   • dup
   • robus-linear-solve
   • boundary-cells
   • reduce-simplicial-complex
   • compare-cell
   • compate-oriented-cell
   • base64-js
   • ieee754
   • is-array
   • monotone-convex-hull-2d
   • incemental-covex-hull
   • affine-hull
   • cwise-compiler
   • uniq
3. The entrypoint ("src/index.js") is of course not right. (It can be overridden as @Hypercubed pointed out, so it's not a breaking issue). If you want to set the entrypoint only for JSPM, though, adding the following to your package.json should do the trick:

    "jspm": {
        "main": "dist/plotly.js"
    }

[Hypercubed]

I have it working with JSPM. Regading your points:

1. All the requires are resolved by the UMD bundle.
2. The dependancies don't matter if you are installing from github and using the dist.
3. Yes, for now you have use overrides in your app or require('plotlyjs/dist/plotly').

[lyschoening]

You're right, that works. Sorry, I failed to see that the dependencies are bundled into the file. So in that case, installation from github (github:plotly/plotly.js) works because installation from github does not try to process dependencies and treats the module format as global; installation from NPM (npm:plotly.js) works with this override:

{
    "main": "dist/plotly.js",
    "format": "global",
    "dependencies": []
}

[Hypercubed]

I think maybe the "dependencies" should be an empty object {}.

Kind of a side note I'm not personally suggesting that anything be added to plotly's package.json (at least at this point) because I still hope to get the CJS and install via npm registry to work directly. Currently plotly includes d3 and other libraries in the bundle, which means my app, if I include the dist/plotly bundle, has a lot of redundant code.

[Hypercubed]

The only thing currently preventing me from using plotly.js with SystemJS/JSPM is glslify-deps. glslify-deps requires graceful-fs here: https://github.com/stackgl/glslify-deps/blob/master/index.js#L2 which causes Uncaught Error: process.binding is not supported . If I comment out that line (likely breaking disabling glsl) plotly runs in the browser.

I don't know enough about glslify to suggest a solution at this point... except maybe modularize the code in a way that separates the glsl stuff from the d3 stuff.

[etpinard]

@Hypercubed the only plotly.js dependency that depends on glslify-deps is glslify @^1.2.0

I'm not sure how jspm updates the dependencies from patch to patch, but using npm, npm install would in this case update the glslify-deps module to @1.2.5 without modifying anything in this repo.

[Hypercubed]

That's correct... but I'm still having some issues.

[Hypercubed]

fs.ReadStream (https://github.com/isaacs/node-graceful-fs/blob/master/graceful-fs.js#L154) is undefined in nodelibs-fs.

[Hypercubed]

Not a great solution but you can force jspm to skip graceful-fs entirely with the override:

      "npm:graceful-fs@4.1.2": {
        "main": "fs.js"
      },

I think all the gl plots won't work but d3 will.

[Hypercubed]

Also, it will not work unless the /build files are added to the npm package.