React-native is throwing an unexpected token in a firebase import statement. I have been trying to fix this for a long time. I have already installed #react-native-firebase/auth with npm i install #react-native-firebase/auth. Please help.
This is the error screenshot:
This is most probably happening because you cannot import as you did in your code.
As the documentation states for import:
The export parameters specify individual named exports, while the import * as name syntax imports all of them. Below are examples to clarify the syntax.
You need to put there an alias, if you need all of the exported objects from a library as the following:
import * as auth from '#react-native-firebase/auth';
I hope that helps!
Related
I have a folder system in my React project, which you can see in the screenshot below:
I am trying to make import to index.js, located in src/components/KeyboardCard/index.js, from file context.js that is located in src/context.js.
I am getting this error message:
Module not found: Can't resolve '.../context.js' in 'C:\React\top-board\src\components\KeyboardCard'.
Help me please.
It's two levels higher:
import AppContext from '../../context';
You can't have triple dots import there, try:
import AppContext from '../../context.js';
You have provided the wrong path.
import AppContext from '../../context.js';
If you want to go 2 levels higher you have to do it like this:
../../context
Also, you don't have to define file format ".js" there, that's not required.
I'm using expo-server-sdk, and I haven't had this issue with other packages yet, but I'm thinking that this isn't an issue specific to this package.
Basically, my IDE recognises that this package has a default export, and correctly autoimports it as,
import { Expo } from 'expo-server-sdk';
The problem is that this doesn't compile and throws the error,
SyntaxError: The requested module 'expo-server-sdk' does not provide an export named 'Expo'
I'm using the experimental ESM module loader with Node v13.13.0. When I initially set up the config and environment, I was able to use import instead of require, however I am supposed to append the extension of each file I import.
What can be wrong here?
Expo post for reference
If it's exported as default you only need
import Expo from 'expo-server-sdk';
instead of
import { Expo } from 'expo-server-sdk';
I managed to work around this by doing the following:
import Expo from 'expo-server-sdk';
...
let expo = Expo.Expo()
...
if (!Expo.Expo.isExpoPushToken(pushToken)) {
...
}
...
Just import Expo from 'expo-server-sdk'; did not work.
I have a project where I use both react and node (express). When I link to react using src="https://unpkg.com/react#16/umd/react.development.js" etc.. I have no problem using react with JSX in the project, but when I try to import like this:
import React from "react";
I get the error: Uncaught ReferenceError: require is not defined
This kind of "handicaps" me since I want to use modules like axios etc..
I am not using any module bundler
Thanks for any help!
Don't know if I fully understand the question but you seem to be using React.js from a cdn link. With no module bundler. So why are you importing it also? You've already "imported" React.js from your cdn link. =) No need to import it again. The import statement is when you use modules and import them like that with the ES6 syntax. If you want to do that use create-react-app instead.
I had a similar issue that I eventually solved with Browserify. Here's a link to my answer:
https://stackoverflow.com/a/63356350/5132452
Can anybody help me figure out what is wrong with these imports? I upgraded from Angular 2 to 5 (big jump, I know) and have a couple dependency errors. They include:
import { NgModule, Inject } from '#angular/core';
Error:
[ts] Cannot find module '#angular/core'.
Also...
import { HttpModule } from '#angular/http';
Error:
[ts] Module '"/Users/laurenhesterman/Desktop/StormSensor/front-
stormsensor/node_modules/#angular/http/index"' has no exported member '
HttpModule'.
What might I need to change to fix these?
Thanks so much! Let me know if I can clarify anything.
For the first you can do npm -i #angular/core —save.
To solve the second you could try to use import {HttpClientModule} from ‘#angular/common/http.
So it seems the problem was just related to my IDE (vs Code) rather than my project. It wasn't reading my dependencies correctly after I updated. What I did was:
1.Open a TypeScript file. 2.Click the TypeScript version to the bottom right in the Status Bar. 3.Choose Use Workspace Version from the message box.
See here: https://github.com/Microsoft/vscode/issues/34681
I am trying to use import instead of require for all modules in my project, but some older npm modules only have instructions for require.
In the case of 'isomorphic-fetch' I can't find the proper way to use import:
works
require('isomorphic-fetch')
fails
import 'isomporphic-fetch'
import Something from 'isomorphic-fetch'
// error Can't resolve 'isomporphic-fetch' from Project/src/js/
Converting to import does work with the es6-promise module.
works
require('es6-promise').polyfill()
works
import Something from 'es6-promise'
Something.polyfill()
Since import does work with other modules, and require('isomorphic-fetch') works, it's probably a named export problem.
Try import * as Something from 'isomorphic-fetch'
If that works, it's because isomorphic-fetch does not do export deafult so you have to pull in the imports by name, or use the notation I wrote above. Take a look at the MDN link I put on top.