2017-08-17 7 views
8

कोणीय और बूटस्ट्रैप के लिए नया और मैं helloworld ऐप बनाकर थोड़ा हाथों की कोशिश कर रहा हूं। मैं आवश्यक पुस्तकालयों को शामिल किया है, लेकिन मैं यह त्रुटिअभी भी "अनचाहे त्रुटि: बूटस्ट्रैप ड्रॉपडाउन की आवश्यकता है popper.js" popper.js

Uncaught Error: Bootstrap dropdown require Popper.js

मैं popper.js स्क्रिप्ट को शामिल किया है पर अटक कर रहा हूँ jQuery के बाद और बूटस्ट्रैप js से पहले। लेकिन अभी भी ब्राउज़र त्रुटि फेंकता है।

कृपया मदद करें।

कोड इस तरह दिखता है:

<!DOCTYPE html> 
<html ng-app="helloWorld" lang="en"> 
<head> 

<meta charset="utf-8"> 
<meta name="viewport" 
    content="width=device-width, initial-scale=1, shrink-to-fit=no"> 

<title>Index</title> 

<link href="css/bootstrap.min.css" rel="stylesheet"> 

</head> 

<body ng-controller="mainCtrl">{{message}} 

<script src="js/angular.min.js" type="text/javascript"></script> 
<script src="js/jquery-3.2.1.slim.min.js" type="text/javascript"></script> 
<script src="js/popper.min.js" type="text/javascript"></script> 
<script src="js/bootstrap.min.js" type="text/javascript"></script> 
<script src="app/app.js" type="text/javascript"></script> 
</body> 

</html> 
+1

क्या आप popper.js का निर्माण कर रहे हैं? आपको इस मामले में यूएमडी एक की आवश्यकता है –

+0

संपीड़ित एक popper.min.js – Pavan

+0

संस्करण जो मैंने डाउनलोड किया है v1.12.2 है। यूएमडी कौन सा है? – Pavan

उत्तर

10

यह मेरे लिए काम किया:

  1. उपयोग popper.js जो डाउनलोड में नाम "UMD" फ़ोल्डर में हैं आपको यहां https://popper.js.org
  2. फ़ाइलों को अपने bootstrap.js के समान फ़ोल्डर में सहेजें, लेकिन "umd"
  3. डी नामक एक अलग फ़ोल्डर बनाएं bootstrap.js से पहले popper.js eClare

तो, आपके मामले में, बदल

<script src="js/popper.min.js" type="text/javascript"></script> 

को

<script src="js/umd/popper.min.js" type="text/javascript"></script> 
+1

popper-utils की आवश्यकता नहीं है –

+0

ठीक है, धन्यवाद, मैंने अभी संपादित किया है। – Konrad

0

एक ही समस्या थी और इसे हल। आशा करता हूँ की ये काम करेगा!

यदि आप अपने प्रोजेक्ट में Bootstrap.js का उपयोग कर रहे हैं तो बूटस्ट्रैप से पहले चलाने के लिए jquery और popper.js की आवश्यकता होती है।

  1. परियोजना की बूटस्ट्रैप फ़ोल्डर में परियोजना के फ़ोल्डर या सीडी के लिए सीडी: नीचे दिए गए चरणों मुद्दे को हल कर सकते हैं। निष्पादित करें:

    npm install popper.js --save 
    
  2. जाओ http://getbootstrap.com/docs/4.0/getting-started/download/ कॉपी करने के लिए बूटस्ट्रैप CDN खंड जिसमें कहा गया है के तहत स्क्रिप्ट और लिंक सामग्री - आप हमारी संकलित जावास्क्रिप्ट का उपयोग कर रहे हैं, तो jQuery और पॉपर की CDN संस्करणों शामिल करने के लिए मत भूलना। इससे पहले जेएस।

  3. आपका index.html फ़ाइल इस तरह देखने के लिए हो सकता है: आप मूल रूप से निम्न क्रम में 3 स्क्रिप्ट src = "" टैग के लिए देख रहे हैं (jQuery के संस्करणों और popper.js के आधार पर) jQuery> popper.js> bootstrap.js नोट: संपादक मुझे स्क्रिप्ट टैग जोड़ने की अनुमति नहीं देता है। कृपया उन्हें जोड़ें।

    src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"> 
    
    src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"> 
    
    src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"> 
    
2

Indra4ev3r का जवाब एक MVC5 परियोजना के लिए VS2015 अद्यतन 3 पर मेरे लिए काम किया। उदाहरण के लिए, बूटस्ट्रैप से पहले popper स्विच।

bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
"~/Scripts/umd/popper.js", 
"~/Scripts/bootstrap.js")); 
संबंधित मुद्दे