I made the project using this link as my starting file.
https://github.com/facebookincubator/create-react-app
But after i tried to make Facebook login button with follow by their official docs with this.
componentDidMount(){
console.log('login mount');
window.fbAsyncInit = function() {
FB.init({
appId : '320866754951228',
xfbml : true,
version : 'v2.6'
});
FB.getLoginStatus(function(response) {
//this.statusChangeCallback(response);
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
}
So i got this errors when the browser was refreshed.
Failed to compile.
Error in ./src/components/user_profile/LoginForm.js
/Sites/full_stack_production/xxxxx
70:13 error 'FB' is not defined no-undef
76:13 error 'FB' is not defined no-undef
✖ 2 problems (2 errors, 0 warnings)
So i guess because ESLint that cause this errors.
How can i fix this or make the exception for this FB
variable?
Thanks!
Run our React App to login with FacebookGo to https://localhost:3000 and you can see the browser displays a button to Login With Facebook as below. Click the Login with Facebook\ button then it will be a Facebook login dialog pop up.
FB. logout(function(response) { // user is now logged out }); And this is the code that I used react-facebook-rogin Library. import React from "react"; import Navbar from './components/Navbar'; import { BrowserRouter as Switch, Route } from 'react-router-dom' import './components/Navbar.
React (also known as React. js or ReactJS) is a free and open-source front-end JavaScript library for building user interfaces based on UI components. It is maintained by Meta (formerly Facebook) and a community of individual developers and companies.
ESLint doesn't know that the variable FB
is a global. You can declare a variable you referenced as a global by adding the following to the top of your file:
/*global FB*/
For more information, check out the "Rule Details" section on the official ESLint docs: http://eslint.org/docs/rules/no-undef
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With