Can't run vz-line-chart in demos (plugin development related)

I’m working on a plugin for TensorBoard that uses the vz-line-charts and I’m unable to test the work using bazel run DEMO_TARGET as I get the following error in the browser:

Uncaught SyntaxError: Unexpected token export vz-chart-helpers.js:15

As I understand it, the JavaScript generated by the TypeScript compiler is considered a module (it contains top-level exports) and therefore won’t work in browsers without a module loader. As vulcanize inlines everything, this problem doesn’t show up in the distribution, just in development workflow.

How does Google deal with this when developing components? Even with small components, vulcanize takes quite a while to run and the generated file is impractical for debugging. I’d like a work flow that simply supports a browser refresh after a file edit. Apart from the module problem described here, this works well using bazel run DEMO_TARGET.

Any thoughts on how to with with these modules using this (or a similar) dev workflow?

[wchargin]

I agree that it’s suboptimal. Within Google, we just work with it. Note that the generated file becomes much more debuggable if you ask Chrome to pretty-print it. (Firefox has an equivalent feature.) Variable names are minified, but property names never are, so you can quickly find a piece of code by looking for a nearby foo.somewhatUncommonPropertyName in your source and <C-f>ing for .somewhatUncommonPropertyName. It’s not the best, but it does the job.

I feel your pain, though, and would be very happy if we had some sort of incremental vulcanization.

[chihuahua]

@gar1t, indeed if you come up with ways to optimize/streamline the workflow, let us know or tell the world. That would be awesome. And yeah, that sums up our current approach.

Also, in general, feel free to ping us any time about your plugin, especially how we can unblock/assist.