ReferenceError: bootstrap is not defined · Discussion #31239

Open modal programmatically - ReferenceError: bootstrap is not defined. ... I'm importing in the main.js file of my vue app the bootstrap.min.js file using ... Skiptocontent {{message}} twbs / bootstrap Public Notifications Fork 76.3k Star 156k Code Issues 318 Pullrequests 113 Discussions Actions Projects 7 Security Insights More Code Issues Pullrequests Discussions Actions Projects Security Insights Openmodalprogrammatically-ReferenceError:bootstrapisnotdefined #31239 Answered by Johann-S realrecordzLab askedthisquestionin General Openmodalprogrammatically-ReferenceError:bootstrapisnotdefined #31239 realrecordzLab Jul4,2020 · 5answers · 3replies Answered by Johann-S Returntotop realrecordzLab Jul4,2020 I'musingbootstrapv5inmyvueapp.I'mimportingthecssanditworksfine. Iwanttousethemodalcomponentandopenitprogrammatically.I'mimportinginthemain.jsfileofmyvueappthebootstrap.min.jsfileusingthissyntax:import'bootstrap/dist/js/bootstrap.min.js'andinmymethodsI'vecreatedafunctionthathavethiscode: showTableData(){ letdate=newDate().toLocaleDateString() letdataExportModal=newbootstrap.Modal(document.getElementById('myModal')) dataExportModal.show() } WhatishappeningisthatIgetthiserrorinconsolewhenIclickonthebuttonthatwillusethefunction:ReferenceError:bootstrapisnotdefined I'mnotsureonwhat'swrongwiththecode,butanyhelpwillbeappreciated. 1 Answeredby Johann-S Jul5,2020 AsimpleBootstrap5+Vue.jsproject:https://stackblitz.com/edit/bootstrap5-vuejs enjoy😉 Viewfullanswer Replies 5suggestedanswers · 3replies Oldest Newest Top edited Johann-S Jul5,2020 Collaborator Hi@realrecordzLab, ThereareseveralwaytoimportBootstrap.Ifyou'reusingVue.jsIassumeyouhaveaWebpackbundlerunderthehood. SoyoucanimportourModalcomponentlikethat: import{Modal}from'bootstrap' orifyouwanttoimporteverythingyoucando: import*asBootstrapfrom'bootstrap' 2 👍 5 0replies realrecordzLab Jul5,2020 Author I'vetriedtoimportonlythemodalcomponentbutIgeta`bootstrapisnot defined`error.I'musingthemodalinsideacomponent,triedtoimportthe bsjavascriptalsotherebutsameproblem,Idon'tknowwhat'swrong,but I'mstartthinkingthatit'sabugofthenewversionofbootstrap? 1 👍 3 1reply DeoThemes Feb10,2021 I'mhavingthesameissue.Didyoufindsolution? 👍 1 Johann-S Jul5,2020 Collaborator AsimpleBootstrap5+Vue.jsproject:https://stackblitz.com/edit/bootstrap5-vuejs enjoy😉 Markedasanswer 2 🎉 2 ❤️ 2 2replies realrecordzLab Jul5,2020 Author Iwilltakealook,I'monsinglefilecomponentsbutIwillgiveanewtrytotheimportasyou'vesuggested! AshutoshSharma7 Jul15,2021 HeyGuyz, Ifoundthesolutionafteralotofstruggle. Addinapplication.js window.bootstrap=require('bootstrap/dist/js/bootstrap.bundle.js') afterthis"`bootstrapisnotdefined"IS Ex import'bootstrap' require("@rails/ujs").start() require("turbolinks").start() require("@rails/activestorage").start() require("channels") window.bootstrap=require('bootstrap/dist/js/bootstrap.bundle.js') AnswerselectedbyJohann-S AshutoshSharma7 Jul15,2021 HeyGuyz, Ifoundthesolutionafteralotofstruggle. Addinapplication.js window.bootstrap=require('bootstrap/dist/js/bootstrap.bundle.js') afterthis"`bootstrapisnotdefined"IS Ex import'bootstrap' require("@rails/ujs").start() require("turbolinks").start() require("@rails/activestorage").start() require("channels") window.bootstrap=require('bootstrap/dist/js/bootstrap.bundle.js') 3 👍 1 0replies deepakmahakale Aug31,2021 Justreplacethefollowinginapp/javascript/packs/application.js require("bootstrap") with window.bootstrap=require("bootstrap") workedformeinrails6+webpacker+bootstrap5 3 👍 2 0replies Signupforfree tojointhisconversationonGitHub. Alreadyhaveanaccount? Signintocomment Category #️⃣ General Labels Noneyet 5participants Addheadingtext Addboldtext, Additalictext, Addaquote, Addcode, InsertLink LinkText URL Add Addalink, Addabulletedlist, Addanumberedlist, Addatasklist, Directlymentionauserorteam Referenceanissueorpullrequest Addheadingtext Addboldtext, Additalictext, Addabulletedlist, Addanumberedlist, Addatasklist, 👍 1 👎 1 😄 1 🎉 1 😕 1 ❤️ 1 🚀 1 👀 1 Youcan’tperformthatactionatthistime. Yousignedinwithanothertaborwindow.Reloadtorefreshyoursession. Yousignedoutinanothertaborwindow.Reloadtorefreshyoursession.