@latest and other things

Challenge: Get the dice render to work with modern tools

Actions: First I tried to update things as the old versions were unable to handle various tasks but this created a lot of red errors. The red errors started by saying the version it was trying to install as well as the conflicts. These conflicts were what version something is expecting. Because I was using an old create react app, older versions were installed instead of new so I had to uninstall and then install with the @latest tag. @ and version allow for specific versions to be installed

This however created a new error

“THREE.WebGLRenderer: Context Lost”

This was unclear and efforts to solve it via videos were unhelpful but. Tests with basic spheres and boxes worked so the problem must have been with the useconvex feature. Further testing revealed that by removing the arg part. the error was not there. This however resulted in the tetrahedron falling through the plane.

Next test was to try usesphere which resulted in the tetrahedron appearing but with physics like a sphere.

Thus, the problem was with args. But no easy solution was available. Help was needed.

First, I asked stack overflow which provided no assistance. Then I found on the NPM website that the package had a discord channel which I joined and asked. Still no help. Finally, on the github page, an issue was opened up, and help was received. Apparently, newer versions of three had deprecated this function (why is unclear). Thus, he suggested that I look at the examples in the github file. Will see if that works.

Hi, looking at the article you’re following, despite it being seemingly written this year, it’s using v0.5.0 of use-cannon (pre-rename).

Passing geometries to cannon directly was a convenience feature that was possible when THREE still supported legacy Geometry implementations. Check out the Convex polyhedron example to see how to properly create one.

At a minimum, you should pass vertices and faces, which you can get by using legacy Geometry conversions.




Starting a tech bootcamp

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Arrays Talking to Arrays

Thinking of BEM as a UI Philosophy Instead of a CSS Naming Convention

Data Flow Map using Cytoscape and Vue.js

Angular-Custom Form Validation

JS:BASICS — A series on fundamentals of Javascript

Dart data types

7 Killer JavaScript Snippets

Designing UI for React Native

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Jesse Chung

Jesse Chung

Starting a tech bootcamp

More from Medium

Lead During Organizational Change

Life at CMKL #3: Innovation Design

Experience at LetsGrowMore.

A decision is a decision is a decision