dimforge / rapier.js

Official JavaScript bindings for the Rapier physics engine.
https://rapier.rs
Apache License 2.0
412 stars 57 forks source link

Built app WASM issue after upgrading to 0.13.1 #278

Closed Noobulater closed 1 month ago

Noobulater commented 4 months ago

After upgrading from ^0.11.2, and then building using vite build, the resulting app will encounter this issue when creating a new physics world. Tested using https://github.com/viridia/demo-rapier-three

Steps to reproduce 1.) Install the repo https://github.com/viridia/demo-rapier-three 2.) Upgrade rapier to the latest version 3.) Build using npm run build 4.) Serve the resulting dist directory and test the app

Resulting Behavior rapier-be6a9884.js:1 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'rawintegrationparameters_new') at new tt (rapier-be6a9884.js:1:30250) at new Me (rapier-be6a9884.js:1:71843) at new Dt (rapier-be6a9884.js:1:100396) at mp.attach (index-4c621a1f.js:3191:107366) tt @ rapier-be6a9884.js:1 Me @ rapier-be6a9884.js:1 Dt @ rapier-be6a9884.js:1 attach @ index-4c621a1f.js:3191 await in attach (async) fp @ index-4c621a1f.js:3191 (anonymous) @ index-4c621a1f.js:3191

On Engine.ts line 90

this.physicsWorld = new r.World(gravity);

Expected Behavior The physics world is created and physics works successfully

Noobulater commented 3 months ago

Still an issue with 0.13.1

EyeOfMidas commented 3 months ago

I am also having this issue. vite build works fine but when I try to view the built project, I get the same error Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'rawintegrationparameters_new') in the browser window.

edimitchel commented 3 months ago

I have fix the problem locally by having found the source of it: tree-shaking from vite/rollup removes the function which initializes the wasm instance because not detected as used on execution thus not declared as having side effects.

The solution is to apply the sideEffects field in the rapier's package.json to ./*.js (or something better). I tried to use more precise options (by using rapier_wasm3d_bg.js but it doesn't work)

edimitchel commented 3 months ago

Another solution which doesn't need a change from rapier is to disable tree shaking from the vite config.

// vite.config.ts
+  build: {
+    rollupOptions: {
+      treeshake: false,
+    }
+  }
EyeOfMidas commented 3 months ago

Another solution which doesn't need a change from rapier is to disable tree shaking from the vite config.

// vite.config.ts
+  build: {
+    rollupOptions: {
+      treeshake: false,
+    }
+  }

The workaround from @edimitchel worked perfectly for me, Thanks a million, I can build for production again!

Gugustinette commented 2 months ago

Another solution which doesn't need a change from rapier is to disable tree shaking from the vite config.

// vite.config.ts
+  build: {
+    rollupOptions: {
+      treeshake: false,
+    }
+  }

I don't know how tf you found this was the problem, but you saved me YEARS of debugging lol thanks 🤝

edimitchel commented 2 months ago

A real pleasure ! I know I help a lot @Vrixyz ;)

Just by disabling the minifier and dive into the code and find out the code which initializes the wasm context was absent. By usually working with Vite, I just find out that the code was identified as not needed and tree shook.

I would suggest to update the package.json file to avoid this situation for any other application.

Vrixyz commented 2 months ago

Thanks @edimitchel ! I'm glad there is a workaround in user space :)

Modifying sideEffects on our end is not trivial because it is generated from webpack ; we could make a script to inject that after generation (and I'd probably approve such a script, as from my tests it didn't seem to impact package size (❓)), but I'd prefer to understand why it's needed in the first place:

The answer to these questions will prompt us where is our next step to make progress 👍

edimitchel commented 2 months ago

Hi, I don't think this problem is related to rollup but how is used wasm-pack (not webpack as you mentioned).

The script rapier2d/build_typescript.sh is doing things on the package.json, we just need to replace the sideEffect option to the one we need as the files mentionned today are not existing, so no regression would be created.