I have referred this documentation to add google-signin in my react native app, followed all the steps mentioned but could not get the result as specified in the documentation. I have imported the following statement
import { GoogleSignin, GoogleSigninButton, statusCodes } from 'react-native-google-signin';
But Whenever I add this statement in my login file it gives me following error.
i think you need make some changed in your file path shown in error message
F:\ReactProjects\SearchApp\node_modules\react-native-google-signin\src\GoogleSignin.android.js
make sure you import following two lines correctly
import React, { Component } from 'react';
import PropTypes from 'prop-types';
install this and your problem goes away "npm install --save prop-types"
Related
I work in a group project in gitlab, and when i try to run yarn dev for my react project I get the following error:
Attempted import error: '#mui/material/Typography' does not contain a default export (imported as 'Typography').
And the same error from TextField
This is how I import Typograpgy:
import Typography from '#mui/material/Typography';
Other imports works fine, but not TextField and Typography
Does anyone know the solution for this problem? I am the only one in the group that gets this error
I have tried to import by using
import {Typography} from '#mui/material'
instead, but that doesn't work either
I remember that I got a similar issue using material ui, one default export cannot be found and I fixed it by deleting node_modules folder and run :
npm install
I've found out that components without import React from 'react'; lines works well.
I've added import React from 'react'; to the first line of .jsx files conventionally. And I saw many open source with this line.
Then why do we add this line unnecessarily?
You no longer need to import React from "react". Starting from the release 17 of React, JSX is automatically transformed without using React.createElement.However, other exports like hooks must be imported.
if you use a builder like esbuild, unfortunately you will need to import react in every file because it would be an error: Uncaught ReferenceError: React is not defined
but if you use the default builder you don't have to import react in each file
So I am trying to use the Errors component in my code, taken from
https://davidkpiano.github.io/react-redux-form/docs/api/Errors.html
But VSCode is telling me that Errors is not defined, so I tried importing it like import { Errors } from 'reactstrap'; which makes the error go away but when running the website with yarn start I get "Attempted import error: 'Errors' is not exported from 'reactstrap'."
Any ideas?
Errors is provided in the react-redux-form package, so you need to import that module from the place where it's defined:
import { Errors } from 'react-redux-form';
I am trying to import elements from react semantic ui like this after installing via npm.
import React, { Component } from "react";
import "./App.css";
import { Button } from "semantic-ui-react";
class App extends Component {
render() {
return <Button>hi</Button>;
}
}
export default App;
But i get this error.
I guess the app was already running when you installed semantic-ui package, therefore, the appropriate file were not loaded.
Keep in mind to restart your app after installing every package or simply stop it before installing.
There are two possible scenarios for this error:
1.Hot module reload not working: Sometimes the npm does not automatically reload the pages, so re-starting the app would solve this problem.
2.Yarn / NPM mismatch: Some packages (especially semantic-ui) throws error when there is a mismatch with package-json and yarn.lock. It is recommended to stick with yarn package manager if you are using yarn.
Hope this helps :)
I built an application using jhipster v5.3.4 choosing React option for frontend. It works fine with Edge and Chrome but renders a blank page on Internet Explorer 11.
I've read the solution is install and include babel-polyfill but I´m not sure how to do this.
What I've done:
npm install --save-dev babel-polyfill
At the top of index.tsx, add import babelPolyfill from 'babel-polyfill';
The result is the same, blank page and console error: "Symbol is undefined"
Finally the answer to make it works is:
import React from 'react';
import ReactDOM from 'react-dom';
import 'babel-polyfill';