rapier.js icon indicating copy to clipboard operation
rapier.js copied to clipboard

Built app WASM issue after upgrading to 0.13.1

Open Noobulater opened this issue 1 year ago • 5 comments

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 avatar Apr 24 '24 00:04 Noobulater

Still an issue with 0.13.1

Noobulater avatar May 21 '24 06:05 Noobulater

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.

EyeOfMidas avatar May 23 '24 18:05 EyeOfMidas

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 avatar May 29 '24 21:05 edimitchel

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,
+    }
+  }

edimitchel avatar May 29 '24 22:05 edimitchel

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!

EyeOfMidas avatar May 31 '24 17:05 EyeOfMidas

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 🤝

Gugustinette avatar Jul 06 '24 19:07 Gugustinette

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.

edimitchel avatar Jul 07 '24 15:07 edimitchel

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:

  • is it a bug in webpack, where it missed a side effect ?
  • is it a bug in rollup ? where they somehow treeshake too much ?
  • is it a bug from our side, where we missed some configuration ?
  • something else ? 🤔

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

ThierryBerger avatar Jul 08 '24 13:07 ThierryBerger

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.

edimitchel avatar Jul 08 '24 14:07 edimitchel

I'll add this here for other people still encountering this issue - in my case it was incorrect use of the library (I'm using webpack).

The solution is in the official docs, it's important that you run RAPIER.init() before using the library unless your bundler knows to do this for you.

aggregate1166877 avatar Mar 19 '25 08:03 aggregate1166877

I need some help. I am using vite and RAPIER.init() function does not exists. The bulder should do it on its own I far as I understand, but it is not happening.

import { defineConfig } from 'vite';
import wasm from 'vite-plugin-wasm';
import topLevelAwait from 'vite-plugin-top-level-await';

export default defineConfig({
	root: './',
	publicDir: 'public',
	build: {
		outDir: 'dist',
		emptyOutDir: true,
		rollupOptions: {
			treeshake: false,
		}
	},
	server: {
		open: true,
	},
	plugins: [wasm(), topLevelAwait()],
});

I am using latest version 0.17.0

Akxe avatar May 17 '25 14:05 Akxe

@edimitchel thank you you saved my life :) , i had the same issue ( TypeError: Cannot read properties of undefined (reading 'rawintegrationparameters_new')

thiziribouaziz avatar Jun 22 '25 13:06 thiziribouaziz