Giters

mjyc / jammerjs

Add touch gesture-like hand gestures in your app; based on Handtrack.js + Hammer.js

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Examples build error

pwab opened this issue · comments

commented

Cool project. I tried it in the Codesandbox with current FF nightly and Chrome but only got 4 FPS. I'm sure this is because of my poor PC hardware. But I wanted tweak the camera settings because I think it could be working with resolutions lower than 1080p (and so maybe speed it up a bit).

I tried to run the demo in the examples folder but wasn't succesful. I'm relativly new to npm in general but I run npm install and npm start in the folder and got a build error:

×  C:\...\examples\demo\src\index.js:1:32: Cannot resolve dependency 'jammerjs'
> 1 | import * as HandtrackTouch from 'jammerjs';
    |                                ^

Here is the log:

Microsoft Windows [Version 10.0.18363.836]
(c) 2019 Microsoft Corporation. Alle Rechte vorbehalten.

C:\Users\pwab>cd C:\Users\pwab\Desktop\jammerjs-master\examples\demo

C:\Users\pwab\Desktop\jammerjs-master\examples\demo>npm install

> deasync@0.1.14 install C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\deasync
> node ./build.js


C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\deasync>if not defined npm_config_node_gyp (node "C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin\\..\..\node_modules\node-gyp\bin\node-gyp.js" rebuild )  else (node "C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js" rebuild )
Die Projekte in dieser Projektmappe werden nacheinander erstellt. Um eine parallele Erstellung zu ermöglichen, müssen Sie den Schalter "-m" hinzufügen.
  deasync.cc
  win_delay_load_hook.cc
     Bibliothek "C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\deasync\build\Release\deasync.lib" un
  d Objekt "C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\deasync\build\Release\deasync.exp" werden
  erstellt.
  deasync.vcxproj -> C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\deasync\build\Release\\deasync.no
  de
Installed in `C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\deasync\bin\win32-x64-node-12\deasync.node`

> parcel-bundler@1.12.3 postinstall C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\parcel-bundler
> node -e "console.log('\u001b[35m\u001b[1mLove Parcel? You can now donate to our open collective:\u001b[22m\u001b[39m\n > \u001b[34mhttps://opencollective.com/parcel/donate\u001b[0m')"

Love Parcel? You can now donate to our open collective:
 > https://opencollective.com/parcel/donate
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

added 720 packages from 527 contributors and audited 813 packages in 36.533s
found 478 vulnerabilities (199 low, 4 moderate, 273 high, 2 critical)
  run `npm audit fix` to fix them, or `npm audit` for details

C:\Users\pwab\Desktop\jammerjs-master\examples\demo>npm start

> @ start C:\Users\pwab\Desktop\jammerjs-master\examples\demo
> parcel index.html --open

Server running at http://localhost:1234
npm WARN deprecated babel-preset-es2015@6.24.1: �  Thanks for using Babel: we recommend using babel-preset-env now: please read https://babeljs.io/env to update!
npm WARN deprecated chokidar@1.7.0: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated core-js@2.6.5: core-js@<3 is no longer maintained and not recommended for usage due to the number ofBrowserslist: caniuse-lite is outdated. Please run next command `npm update`\fsevents):
Browserslist: caniuse-lite is outdated. Please run next command `npm update`
\ Building css-loader.js...Trace: The node type SpreadProperty has been renamed to SpreadElement
    at Object.isSpreadProperty (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\types\lib\validators\generated\index.js:4304:11)
    at hasSpread (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\babel-plugin-transform-object-rest-spread\lib\index.js:38:13)
    at PluginPass.ObjectExpression (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\babel-plugin-transform-object-rest-spread\lib\index.js:234:14)
    at newFn (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\visitors.js:193:21)
    at NodePath._call (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\path\context.js:53:20)
    at NodePath.call (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\path\context.js:40:17)
    at NodePath.visit (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\path\context.js:88:12)
    at TraversalContext.visitQueue (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\context.js:118:16)
    at TraversalContext.visitMultiple (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\context.js:85:17)
    at TraversalContext.visit (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\context.js:144:19)
Trace: The node type SpreadProperty has been renamed to SpreadElement
    at Object.isSpreadProperty (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\types\lib\validators\generated\index.js:4304:11)
    at hasSpread (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\babel-plugin-transform-object-rest-spread\lib\index.js:38:13)
    at PluginPass.ObjectExpression (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\babel-plugin-transform-object-rest-spread\lib\index.js:234:14)
    at newFn (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\visitors.js:193:21)
    at NodePath._call (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\path\context.js:53:20)
    at NodePath.call (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\path\context.js:40:17)
    at NodePath.visit (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\path\context.js:88:12)
    at TraversalContext.visitQueue (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\context.js:118:16)
    at TraversalContext.visitMultiple (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\context.js:85:17)
    at TraversalContext.visit (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\context.js:144:19)
/ Building hammer.js...Browserslist: caniuse-lite is outdated. Please run next command `npm update`
×  C:\Users\pwab\Desktop\jammerjs-master\examples\demo\src\index.js:1:32: Cannot resolve dependency 'jammerjs'
> 1 | import * as HandtrackTouch from 'jammerjs';
    |                                ^
  2 | import Hammer from 'hammerjs';
  3 |
  4 | const el = document.querySelector("#hit");
Trace: The node type SpreadProperty has been renamed to SpreadElement
    at Object.isSpreadProperty (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\types\lib\validators\generated\index.js:4304:11)
    at hasSpread (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\babel-plugin-transform-object-rest-spread\lib\index.js:38:13)
    at PluginPass.ObjectExpression (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\babel-plugin-transform-object-rest-spread\lib\index.js:234:14)
    at newFn (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\visitors.js:193:21)
    at NodePath._call (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\path\context.js:53:20)
    at NodePath.call (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\path\context.js:40:17)
    at NodePath.visit (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\path\context.js:88:12)
    at TraversalContext.visitQueue (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\context.js:118:16)
    at TraversalContext.visitMultiple (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\context.js:85:17)
    at TraversalContext.visit (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\context.js:144:19)
Trace: The node type SpreadProperty has been renamed to SpreadElement
    at Object.isSpreadProperty (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\types\lib\validators\generated\index.js:4304:11)
    at hasSpread (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\babel-plugin-transform-object-rest-spread\lib\index.js:38:13)
    at PluginPass.ObjectExpression (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\babel-plugin-transform-object-rest-spread\lib\index.js:234:14)
    at newFn (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\visitors.js:193:21)
    at NodePath._call (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\path\context.js:53:20)
    at NodePath.call (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\path\context.js:40:17)
    at NodePath.visit (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\path\context.js:88:12)
    at TraversalContext.visitQueue (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\context.js:118:16)
    at TraversalContext.visitMultiple (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\context.js:85:17)
    at TraversalContext.visit (C:\Users\pwab\Desktop\jammerjs-master\examples\demo\node_modules\@babel\traverse\lib\context.js:144:19)

Any hints for troubleshooting?

commented

Thanks for trying jammerjs out on windows! Skimming the error messages made me think that the problem has to do with your babel & parcel setup, which I'm not familiar with how well they work on windows nor how they should be configured on windows. If you somehow fix it, it would be great if you can share your experience here or create PR for future users.

Regarding the speed, I found this(codesandbox) a recent handtracker that was much more performant than the one I was using (e.g., using with the WebAssembly setup recommend here, I was able to run the tracker at >30hz on 2014 MacbookPro).

Conceptually what I did with jammer is simply setting handtracker outputs as inputs to hammerjs, a gesture recognition library. If you manage to use mediapipe's handtracker, integrating it with hammerjs should be simple (as shown here). Most problems I faced were dealing with setting things up.