Rails 6 ShapeDiver API Integration

Grasshopper ShapeDiver
1

Hi,

I’m looking for some best practices when integrating the ShapeDiver API into a Rails 6 app that’s using both Webpack (through the Webpacker gem) and React.

Getting setup is pretty straightforward thanks to https://codepen.io/ShapeDiver/pen/oNvoBxb. My concern is the reliance on loading all dependencies through HTML script tags. This doesn’t take advantage of the module bundler, existing libraries already loaded through a bundler, single-page apps (Rails API mode)…

I took a look at the ‘shapediver-types’ npm package (could you please improve the readme on this?) and had to review the actual package to be sure it did include ShapeDiver API v2. Went ahead and installed ‘shapediver-types’, ‘three’, and ‘axios’ via yarn hoping this would enable me to use Webpack, React, and ShapeDiver in my Rails 6 app. Now I needed to setup TypeScript with a TypeScript loader for Webpack - a bit excessive for a single library and I’m not feeling confident you support this (the only documentation I could find is a forum reply). With this in mind, I figured I’d use Webpack for the dependencies (three.js, axios) and load the smaller sdv.min.js library through script tags. This revealed another dependency Reflector by Slayvin. At this point, I decided this was all too messy and I’ll just ask for your recommendations.

Is loading the ShapeDiver API and all of its dependencies through script tags in an HTML file the best option? Will this change?

Thanks

2

Yes, loading the ShapeDiver API through script tags is the best way to go about it. shapediver-types does not include viewer, it is just a TypeScript definitions package which can be included in order to make development a bit easier for TypeScript developers and help with viewer definitions. Those are just typed definitions for JavaScript libraries, not libraries themselves.

If you need TypeScript definitions just add “shapediver-types” to TypeScript compiler options, more in the Add ShapeDiver types section of readme.

We plan to have an npm package for the whole viewer in the next version which will be out next year. Thanks for your feedback on readme, it will be improved soon.

3

Thanks Pavol. I’ll use script tags and anticipate an npm package in the future.