Uncaught ReferenceError: Module is not defined

[LucusWebsites]

Heya, first of all thanks a lot for this awesome library.

I am trying to implement it in my vite project, and I am getting this error: Uncaught ReferenceError: Module is not defined

Any ideas?

index.js:1 Uncaught ReferenceError: Module is not defined
    at Object.<anonymous> (index.js:1:3214893)
    at 894 (index.js:1:3214924)
    at I (index.js:1:3304852)
    at 150 (index.js:1:1248434)
    at I (index.js:1:3304852)
    at 970 (index.js:1:1162061)
    at I (index.js:1:3304852)
    at index.js:1:3721005
    at index.js:1:3737669
    at node_modules/react-three-mind/dist/index.js (index.js:1:3737690)
(anonymous) @ index.js:1
894 @ index.js:1
I @ index.js:1
150 @ index.js:1
I @ index.js:1
970 @ index.js:1
I @ index.js:1
(anonymous) @ index.js:1
(anonymous) @ index.js:1
node_modules/react-three-mind/dist/index.js @ index.js:1
__require @ chunk-J43GMYXM.js?v=536ca8d3:11
(anonymous) @ index.js:1

[tommasoturchi]

Hi,
I think this is a "known issue". I've been having problems properly exporting this module to make it work across different environment. It's been tested with CRA (see the examples folder), but Vite doesn't seem to like the way it's exported. I tried different bundlers and configurations before going public, but with no success. I think the library is inheriting the exporting style of mind-ar, which makes it a bit problematic (importing a web-worker code without requiring extra plugins to integrate it).
I'm open to any suggestions here, I've been considering rewriting the mind-ar web-workers and related code to make it exportable, but if there's any other solution someone wants to recommend, I can try :-)
In the meantime, you can switch to create-react-app where it works. I'll play around again with Vite to see if I can find any workaround.

Tommaso

[tommasoturchi]

This might help moving towards a more robust bundling solution: hiukim/mind-ar-js#295
Will keep you posted!

[jmschrack]

Hey that's my PR! 👍
@tommasoturchi
I actually have a branch that's full Vite support you might like. It works for three.js and image-targets, but i haven't tested beyond that. The one thing i haven't gotten working is the loading/scanning overlay. (It also has contains my rework of the Detector code so you can compile image targets offline!)
https://github.com/jmschrack/mind-ar-js/tree/vite

[Zaniyar]

Hey that's cool! Can I just do npm i git+https://github.com/jmschrack/mind-ar-js/tree/vite.git to use it in my existing project? or are there other stepps to do?

[jmschrack]

@Zaniyar you no longer need to! It's been merged into the MindAR official repo!

[Zaniyar]

but it's not on the main/master right?

npm i react-three-mind
gives me still the error:

index.js:1 Uncaught ReferenceError: Module is not defined
    at Object.<anonymous> (index.js:1:3213969)
    at 894 (index.js:1:3214000)
    at I (index.js:1:3304209)
    at 150 (index.js:1:1247510)
    at I (index.js:1:3304209)
    at 970 (index.js:1:1161137)
    at I (index.js:1:3304209)
    at index.js:1:3720297
    at index.js:1:3738897
    at node_modules/react-three-mind/dist/index.js (index.js:1:3738918)

[jmschrack]

@Zaniyar oh my code base is only for mind-ar-js , i don't work with react-three-mind. Sorry!

[timothydang]

hi @tommasoturchi , i've got it this issue resolved by migrating to vite and allow production build as a ESM module. You can review the changes at https://github.com/timothydang/react-three-mind/tree/feat/vite-esm-migration - launching examples is working. however, both image tracking and face tracking are now having issues, possibly due to the latest mind-ar version.

[tommasoturchi]

Hi @timothydang
Thank you for this!!! I will check everything and merge, will try and check the issues with tracking, but the vite integration is a super welcome feature 😊