Errors when Importing NPM package version of Aframe-physics-system via Webpack
Petroochio opened this issue · comments
Hi,
I've run into an issue when trying to build a project that imports aframe-physics-system using Webpack and Babel rather than using the CDN.
This is my project repo
I made a working version on glitch as well
This is the error I'm recieving.
It seems there might be a peer dependency I am missing or something. Is that the issue? If so what's the package? Any help would be amazing, thanks!
I'm not familiar with Webpack, but another user contributed the instructions here:
https://github.com/donmccurdy/aframe-physics-system#npm--webpack
Do those help?
@donmccurdy thanks for reply! Tried adding that, but unfortunately it didn't solve any of the errors that are appearing in the screenshot I shared. Also, as it is in the Readme, that code might cause an error. Paths in the include array must be absolute so I used path.resolve(__dirname, 'src') instead.
@InfiniteLee I'm wondering if the THREE.AmmoDebugConstants attachment isn't compatible with ES module imports?
@Petroochio I'm not seeing a the physics system being added to your a-scene https://github.com/Petroochio/aframe_physics_webpack_test/blob/fce9bcdf9bd4e32afba400c9e0fc7bd6498fc2e8/index.html#L7
Hi @InfiniteLee, Thanks for taking a look!
I just added it to my a-scene element like it shows in the docs, but the error still persists. Also on the glitch demo I set up, it seems to work fine without the physics component on a-scene. I also checked version numbers as well, and both the glitch demo and my repo use Aframe v1.0.4 and aframe-physics-system v4.0.1
same error
I have the same issue. I ended up downloading the minified build and require it in my scripts.
No the best solution but it works 🙂
@fabien-lg I ended up doing the same thing and it works for me as well
I have same problem.
vue@2.6.12
aframe@1.0.4
aframe-physics-system@4.0.1
Uncaught TypeError: Cannot read property 'NoDebug' of undefined
at eval (system.js?a296:43)
at Object../node_modules/aframe-physics-system/src/system.js (chunk-vendors.js:252)
at __webpack_require__ (app.js:849)
at fn (app.js:151)
at eval (index.js?4503:13)
at Object../node_modules/aframe-physics-system/index.js (chunk-vendors.js:10)
at __webpack_require__ (app.js:849)
at fn (app.js:151)
at eval (cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Model3D.vue?vue&type=script&lang=js&:8)
at Module../node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Model3D.vue?vue&type=script&lang=js& (app.js:950)```
I'm sorry. I have solved this problem.
Error Code
import "aframe-physics-system
Fixed Code
import "aframe-physics-system/dist/aframe-physics-system"
Thank you!
This will be fixed when we do our next release and publish to npm.
If you want to make it work now, you can import aframe-physics-system from github instead of from npm.
See https://github.com/MignonBelongie/aframe_physics_webpack_test, which I forked from the repo created by @Petroochio, reverting the commits made after opening this issue.
In short, use the following in package.json:
"aframe-physics-system": "github:n5ro/aframe-physics-system#eac2ac0e639e8863b3d1e983ac04a682281586aa"
(That's our latest commit, as I write this.)
Thank you, @Petroochio , for your webpack example, which I will try to incorporate into our docs.