Trying to connect my React Components to the PlayCanvas engine

Help & Support
1

I have found out how to load a PlayCanvas engine into my local server (through index.html in my public folder). I am having trouble importing the PlayCanvas engine into my src folder.

  1. I created a min.js file that has the PlayCanvas code and placed it in my src folder
  2. Created a new React component pasted the example code which is found in PC’s github.
  3. I get an error on my local server of which points to the PlayCanvas engine code.
  Line 3:     'define' is not defined              no-undef
  Line 4:     'define' is not defined              no-undef
  Line 780:   'webkitAudioContext' is not defined  no-undef
  Line 880:   Unexpected use of 'self'             no-restricted-globals
  Line 1125:  'Ammo' is not defined                no-undef
  Line 1125:  'Ammo' is not defined                no-undef
  Line 1125:  'Ammo' is not defined                no-undef
  Line 1125:  'Ammo' is not defined                no-undef

What am I doing wrong? I know that ammo is probably referencing ammo.js physics framework. I tried to copy and paste the ammo.js file into my src file and import it into the PlayCanvas engine file but my local server just crashes at that point.

2

Looks like the solution that I found to this was install the entire playcanvas engine; not just part of it. You can do this by installing a npm module which is directed towards the Playcanvas’ engine. This has all the files required to make the engine code run. Here is a module that a user has created, but you can create your own by forking the repo…

npm module

If you are having issues rendering your model; try to place your PlayCanvas code in componentDidMount