Recast navmesh navigation with react

Questions
1

Hi

I am creating a scene where I want the player to go where I click and I have achieved that in the playground below using a navmesh because eventually I’ll need the player to walk up and down stairs, hills, etc.

I’ve read multiple forums on getting recast-detour to work using npm but haven’t been successful in getting it to work myself. I was hoping there had been some updates or a simple way to get recast-detour working with react. I would like to continue using navmeshes for dynamic x, y, and z player movement in the environment but if there is a different way to achieve this without a navmesh I am open to trying it instead. The error I’m getting with react is below:

ERROR in ./node_modules/recast-detour/recast.js 268:26-49

Module not found: Error: Can't resolve 'path' in 'C:\Users\Jared\Desktop\my-app\node_modules\recast-detour'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:
	- add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }'
	- install 'path-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
	resolve.fallback: { "path": false }


ERROR in ./node_modules/recast-detour/recast.js 280:30-43

Module not found: Error: Can't resolve 'fs' in 'C:\Users\Jared\Desktop\my-app\node_modules\recast-detour'
2

I’ve never seen this error message before. Do you have any idea @RaananW ?

3

that’s interesting. It seems like the recast-detour module is referencing path?

will need to check how it is built and why the path reference is needed.

4

@RaananW
Just for an update, I was able to fix the path error by running npm install path but I’m still getting this part of the error.

Module not found: Error: Can't resolve 'fs' in 'C:\Users\Jared\Desktop\my-app\node_modules\recast-detour'
5

Was able to get rid of the fs error by altering the package.json file in /node_modules/recast-detour by adding

"browser": {
    "fs": false
  },

Recast now working with react. Hope this helps you guys and anyone in the future!

3 Likes