त्रुटि 'एफबी' को कैसे ठीक किया जाए, create-react-app प्रोजेक्ट पर नो-अंडफ परिभाषित नहीं किया गया है?

Question

मैंने इस लिंक का उपयोग अपनी प्रारंभिक फ़ाइल के रूप में प्रोजेक्ट किया है।

https://github.com/facebookincubator/create-react-app

लेकिन उसके बाद मैं इस के साथ अपने सरकारी डॉक्स द्वारा अनुवर्ती के साथ फेसबुक लॉगिन बटन की कोशिश की।

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')); 
} 

तो ब्राउज़र को रीफ्रेश होने पर मुझे यह त्रुटियां मिलीं।

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) 

तो मुझे लगता है क्योंकि ESLint जो इस त्रुटियों का कारण बनता है। मैं इसे कैसे ठीक कर सकता हूं या इस FB चर के लिए अपवाद बना सकता हूं?

धन्यवाद!

Answer 1

ESLint नहीं जानता है कि चर FB एक वैश्विक है। ,

/*global FB*/

अधिक जानकारी के लिए आधिकारिक ESLint डॉक्स पर "नियम विवरण" अनुभाग की जाँच: आप अपनी फ़ाइल के शीर्ष करने के लिए निम्न जोड़कर एक चर आप एक वैश्विक रूप में संदर्भित घोषणा कर सकते हैं http://eslint.org/docs/rules/no-undef

Answer 2

मैं उपयोग this.FB द्वारा इसे ठीक कर सकते बजाय सिर्फ FB

Answer 3

यदि आप रीक्ट ऐप बनाएं का उपयोग करते हैं, तो आपको window से वैश्विक चर को स्पष्ट रूप से पकड़ने की आवश्यकता है।
उदाहरण के लिए: आयात

// It's a global so need to read it from window 
const FB = window.FB; 

हालांकि, अगर पुस्तकालय एक NPM पैकेज के रूप में उपलब्ध है, आप का उपयोग कर सकते हैं:

// It's an npm package so you can import it 
import $ from 'jquery'; 

मुझे आशा है कि इस मदद करता है!

Answer 4

क्या @ दान-अब्रामोव एक और जवाब के लिए एक टिप्पणी में कहा गया है के आधार पर:

FB का उपयोग न करें, इस तरह का उपयोग window.FB

, आप स्पष्ट रूप परिभाषित जहां चर अमेरिकन प्लान की जरूरत है से आना।

Answer 5

अपने .eslintrc फ़ाइल में इस रखो, ताकि आप केवल हर एक फ़ाइल में एक बार और नहीं इसे परिभाषित करना होगा:

"globals": { 
    "FB": true 
}