FirebaseExtended / reactfire

Hooks, Context Providers, and Components that make it easy to interact with Firebase.
https://firebaseopensource.com/projects/firebaseextended/reactfire/
MIT License
3.54k stars 405 forks source link

SyntaxError: Cannot use import statement outside a module #401

Closed seanaguinaga closed 3 years ago

seanaguinaga commented 3 years ago
/Users/sean/GitHub/vap-mono/node_modules/rxfire/auth/index.esm.js:1
import { Observable, from, of } from 'rxjs';
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at Object.compileFunction (node:vm:353:18)
    at wrapSafe (node:internal/modules/cjs/loader:1039:15)
    at Module._compile (node:internal/modules/cjs/loader:1073:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1138:10)
    at Module.load (node:internal/modules/cjs/loader:989:32)
    at Function.Module._load (node:internal/modules/cjs/loader:829:14)
    at Module.require (node:internal/modules/cjs/loader:1013:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (/Users/sean/GitHub/vap-mono/node_modules/reactfire/dist/reactfire.cjs.development.js:27:12)
    at Module._compile (node:internal/modules/cjs/loader:1109:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1138:10)
    at Module.load (node:internal/modules/cjs/loader:989:32)
    at Function.Module._load (node:internal/modules/cjs/loader:829:14)
    at Module.require (node:internal/modules/cjs/loader:1013:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (/Users/sean/GitHub/vap-mono/node_modules/reactfire/dist/index.js:7:20)

on rc2

any ideas?

aalises commented 3 years ago

Running into the same problem.

epodol commented 3 years ago

Can you give a code sample? I would be happy to look into it.

galvarez421 commented 3 years ago

I believe this may be due to https://github.com/FirebaseExtended/rxfire/issues/17.

seanaguinaga commented 3 years ago

Same issue

You’re rightΒ 

On July 9, 2021, "dependabot[bot]" @.***> wrote:

I believe this may be due to FirebaseExtended/rxfire#17 https://github.com/FirebaseExtended/rxfire/issues/17.

β€” You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/FirebaseExtended/reactfire/issues/401#issuecomment- 877288436, or unsubscribe https://github.com/notifications/unsubscribe- auth/ADUMGRHG2F7LNAVSLBQTZ33TW4MGFANCNFSM5ABXMHFA.

fabn commented 3 years ago

Is this solved in v3.0.0-rc.2? Any workaround for this?

epodol commented 3 years ago

Is this solved in v3.0.0-rc.2? Any workaround for this?

I believe this is a problem with FirebaseExtended/rxfire#17. rxfire was updated to 5.0.0-rc.1 in reactfire 3.0.0-rc.1 (#372), so reverting to reactfire 3.0.0-rc.0 is probably the best workaround until FirebaseExtended/rxfire#17 is resolved.

fabn commented 3 years ago

So no chance to use the new useSigninCheck until that is fixed.

epodol commented 3 years ago

Not that I know of. I am looking into this today, so if I find a solution or workaround, I will be sure to post it here. Are you using Next.JS? What version of Node are you using?

fabn commented 3 years ago

Using a brand new next.js app with next@11.0.1

  "volta": {
    "node": "14.17.3",
    "yarn": "1.22.10"
  }
epodol commented 3 years ago

Ok, thank you. I'll try to reproduce it with that set up.

jhuleatt commented 3 years ago

Thanks for the reports! Two workarounds that should work while we investigate FirebaseExtended/rxfire#17. You can either:

  1. Downgrade to reactfire@v3.0.0-rc.0, as @epodol recommended

or

  1. Upgrade to Node 16, which supports ESM
fabn commented 3 years ago
  1. Upgrade to Node 16, which supports ESM

Thanks for this, but I'm currently deploying on Vercel that does not support Node 16 yet.

I'll wait for a resolution.

jhuleatt commented 3 years ago

I just published reactfire@3.0.0-canary.804b3e5, which pulls in rxfire@5.0.0-rc.3, which contains conditional exports for Node.

If anyone has a minute to try out reactfire@3.0.0-canary.804b3e5 and see if it resolves the Node imports issue, can you please? If it works, I'll cut a new release candidate for ReactFire.

fabn commented 3 years ago

Just tried, seems to work with these packages:

yarn add v1.22.10
[1/4] πŸ”  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] πŸ”—  Linking dependencies...
[4/4] πŸ”¨  Building fresh packages...
success Saved lockfile.
success Saved 3 new dependencies.
info Direct dependencies
└─ reactfire@3.0.0-canary.804b3e5
info All dependencies
β”œβ”€ reactfire@3.0.0-canary.804b3e5
β”œβ”€ rxfire@5.0.0-rc.3
└─ rxjs@7.2.0
✨  Done in 14.85s.
jhuleatt commented 3 years ago

Thanks for trying it out @fabn! I've cut a new release candidate v3.0.0-rc.3 that contains this fix.


SIDE NOTE: One upside of this bug is that it collected a bunch of Next.js developers πŸ˜…. We'd like to better understand how people are using ReactFire with Next.js. If anyone here has a minute to leave your feedback in discussion https://github.com/FirebaseExtended/reactfire/discussions/412, it would be a huge help!

payapula commented 3 years ago

I got the same error when deploying the application in vercel and v3.0.0-rc.3 fixed it. Thank you! ❀️

jhuleatt commented 3 years ago

I'm glad it worked, @payapula! Given that it seems like v3.0.0-rc.3 has resolved the problem, I'm going to close this issue.