viz-js icon indicating copy to clipboard operation
viz-js copied to clipboard

Sorry, it's another rollup / typescript question

Open StoneCypher opened this issue 5 years ago • 11 comments

So, okay, I know you're tired of these. I think mine's a little different, though. I don't want TS bells and whistles.

Hi, I really like your work. Stuffing something as hairy as Graphviz through anything, let alone a velcro forest like emscripten, is legitimately fucking impressive.

I am already a semi-successful user of your work. It's pretty great.

I'm making a newer, better one, that has syntax highlighting and widgets and that un-breaks the PNG button and so forth

Really, all I want help to do is stuff this new viz.js setup into a bundle. Right now, I'm loading it distinctly, and playing defer games, but, users are stupid and will extremely struggle with that, so I'd like this all to go into a single file.

Right now I'm considering just concatenating the older version, badbear forest style.

This new one looks like it should be what I want: a re-bake meant for es6 packagers.

I saw this advice you gave around rollup-plugin-url, but for the life of me I can't get it to work.

Honestly, I don't care that much about the TS annotations. I'd maintain them for you if I knew how, and I'm considering learning how, but, I don't think they're related to my problem

I can't get the renderer into the bundle

Do you have, somewhere, a complete example of a bundle being produced that contains everything? I don't actually want fractional or external loading. I want a single .js that does all the ham.

I'm sorry to waste your time with something like this, and again, I'm super thankful for what you built. And, I can make this work with concatenation on the old one, so if you don't have time, that's actually cool, no problem.

Thanks for reading

StoneCypher avatar Dec 06 '18 18:12 StoneCypher

What error are you getting from rollup?

Here's an example of producing a single bundle with webpack: https://github.com/mdaines/viz-examples/tree/master/webpack-no-worker However, Viz.js 2.1.1 has a bug that prevents webpack from processing it successfully in this situation, so I wonder if this is related to what you're seeing? See #160. I have a fix in 2.1.2-pre.1, and I'm going to release 2.1.2 today.

You can also concatenate the viz.js and full.render.js (or lite.render.js) files along with your script. Have a look at this example, which includes them using <script> tags: https://github.com/mdaines/viz-examples/blob/master/script-tag/no-worker.html If you use the that approach, you need to put viz.js before the render script, so the render script add its code to the global Viz object: https://github.com/mdaines/viz.js/blob/master/src/boilerplate/post-module.js#L57

mdaines avatar Dec 08 '18 15:12 mdaines

I got a thousand errors from a thousand paths through rollup, at least 995 of them my own fault, and I don't know enough to tell them apart. However I did not see #160. (Or if I did, I didn't notice it.)

My pernicious problem wasn't actually an error. It was rollup proceeding thinking things were done, with the code not actually physically present in the bundle.

I will see what I can squeeze out of webpack-no-worker. I've managed to avoid webpack this entire time, so, examples in it aren't as universal to me as they ought to be. But I'll see what I can do. Thank you

Concatenation is a last-resort strategy because ideally I want to provide bundles to downstream users, which concatenation basically renders impossible

StoneCypher avatar Dec 08 '18 16:12 StoneCypher

Sorry for the stupid question

no-worker implies that the worker is being packaged in, and that there's no ancillary load, rather than that the facility offered is removed, yes?

StoneCypher avatar Dec 08 '18 16:12 StoneCypher

Yes, the output of the webpack-no-worker example is a single file, bundle.js, that includes both viz.js and full.render.js.

~~I'll see if I can come up with a rollup example as well.~~ I forgot that there already is one: https://github.com/mdaines/viz-examples/tree/master/rollup but it uses a worker.

mdaines avatar Dec 08 '18 16:12 mdaines

You're very generous with your time 😁

TYVM

StoneCypher avatar Dec 08 '18 16:12 StoneCypher

I've added an example for Rollup that doesn't use a worker: https://github.com/mdaines/viz-examples/tree/master/rollup-no-worker

You'll need to effectively tell Rollup not to worry about built-in Node modules like fs, and one way to do that is with the "ignore" Rollup plugin. References to such modules are currently included in the code generated by Emscripten, but aren't actually executed when running in the browser.

mdaines avatar Dec 08 '18 17:12 mdaines

uhuhuhuhuhuhu

so. this now builds and runs correctly in the browser, but attempting to load the commonjs version causes node to respond as if a successful load had happened, then immediately die. wrapping in a try catch does not help or give further information.

john@DESKTOP-26H4050 MINGW64 ~/projects/jssm-viz/build (AttemptingVizJs2Again)
$ node
> try { let v = require('./jssm-viz.cjs.js'); } catch (e) { console.log(e); }
undefined
>
john@DESKTOP-26H4050 MINGW64 ~/projects/jssm-viz/build (AttemptingVizJs2Again)

Which is ... interesting.

StoneCypher avatar Dec 10 '18 20:12 StoneCypher

You can see it here if you're curious.

Load the html in ./docs/ to see it work correctly in le browseur in iife

cd to ./build and attempt to load the cjs in node in the method above to see the kaboom

StoneCypher avatar Dec 10 '18 21:12 StoneCypher

oh wait, i think it's trying to append to a document that doesn't exist, and for some reason that failure is invisible

StoneCypher avatar Dec 10 '18 21:12 StoneCypher

hm, no.

okay. sanity check: is this actually expected to work in node?

StoneCypher avatar Dec 10 '18 21:12 StoneCypher

It should run in node. Here are the tests if you're curious: https://github.com/mdaines/viz.js/blob/master/test-node/render.js

mdaines avatar Dec 10 '18 22:12 mdaines

oh wow, i'm sorry, i didn't realize this was still open

i solved it around two months later, after trying to switch to a fork then coming back

users of modern rollup can see a working example here

StoneCypher avatar Jun 13 '23 17:06 StoneCypher

No problem! I closed it as "not planned" because I'm working on a new version of Viz.js that's somewhat different from 2.x, including when it comes to bundling. (No separate ".render.js" file, for one thing.)

mdaines avatar Jun 13 '23 22:06 mdaines

That's great news

StoneCypher avatar Jun 13 '23 22:06 StoneCypher

incidentally i'm an active user of your library with a strong interest in the contemporary version of graphviz, so if you need a guinea pig, please let me know

StoneCypher avatar Jun 19 '23 22:06 StoneCypher

That's great to hear. I've published the new version, so please give it a try. Although there's a new package name, @viz-js/viz and the API is a little different because of using WebAssembly.

mdaines avatar Jun 20 '23 17:06 mdaines