react-bootstrap doesn't have a default export, so the default import syntax ( import ReactBootstrap from 'react-bootstrap' ) cannot be used in this case.
Home
Public
Questions
Tags
Users
Collectives
ExploreCollectives
FindaJob
Jobs
Companies
Teams
StackOverflowforTeams
–Collaborateandshareknowledgewithaprivategroup.
CreateafreeTeam
WhatisTeams?
Teams
CreatefreeTeam
CollectivesonStackOverflow
Findcentralized,trustedcontentandcollaboratearoundthetechnologiesyouusemost.
Learnmore
Teams
Q&Aforwork
Connectandshareknowledgewithinasinglelocationthatisstructuredandeasytosearch.
Learnmore
React-Bootstrap-importingmodules
AskQuestion
Asked
5years,6monthsago
Modified
2years,4monthsago
Viewed
26ktimes
8
1
I'mtryingtousereact-bootstrap.Seethecodebelow.IfIloadindividualmodules(eg.Button,ButtonGroup,etc.),itworksfine.I'drather,however,importthewholeReactBootstrap(likeinline2below)butthen,itdoesnotrecogniseelementslike.HowdoIdoit?
importReactfrom'react';
importReactBootstrapfrom'react-bootstrap';
import{Button}from'react-bootstrap';
import{ButtonGroup}from'react-bootstrap';
import{DropdownButton}from'react-bootstrap';
import{MenuItem}from'react-bootstrap';
constNavBar=(props)=>{
return(
Something
Dropdownlink
Dropdownlink
Middle
Right
)
}
exportdefaultNavBar;
Thankyou
twitter-bootstrapreactjs
Share
Follow
askedAug19,2016at20:23
WastelandWasteland
4,2771212goldbadges3737silverbadges7272bronzebadges
Addacomment
|
2Answers
2
Active
Oldest
Votes
17
TheanswerprovidedbyNickisnotrecommendedasitwillbloatyourcomponent.
Ratherusethenamedimportshoweverinabettersyntax.
import{Button,ButtonGroup,DropdownButton,MenuItem}from'react-bootstrap';
Thiswayyouknowwhatyouareimportingandkeepthecomponentsizetoaminimum
Share
Follow
answeredApr2,2019at11:48
RustyRusty
7,7801010goldbadges5050silverbadges7070bronzebadges
1
I'dprefertodothis,butforsomereason,itwillnotimportthechildrenofthesecomponents,soIwouldhavetoimportNavbar.Brandetc
– RileyFitzpatrick
Nov6,2019at0:09
Addacomment
|
15
react-bootstrapdoesn'thaveadefaultexport,sothedefaultimportsyntax(importReactBootstrapfrom'react-bootstrap')cannotbeusedinthiscase.Youcandothefollowingthough:
import*asReactBootstrapfrom'react-bootstrap';
Something
Share
Follow
answeredAug19,2016at20:43
NickUraltsevNickUraltsev
21.2k44goldbadges2323silverbadges1414bronzebadges
1
1
sodoyouneedtoputimport*asReactBootstrapfrom'react-bootstrap';ineverycomponent?Itriedtoputitinmyindex.jsfileinsrcbutitwasn'tavailableinmycomponentsthen...
– lightweight
Mar10,2017at15:45
Addacomment
|
YourAnswer
ThanksforcontributingananswertoStackOverflow!Pleasebesuretoanswerthequestion.Providedetailsandshareyourresearch!Butavoid…Askingforhelp,clarification,orrespondingtootheranswers.Makingstatementsbasedonopinion;backthemupwithreferencesorpersonalexperience.Tolearnmore,seeourtipsonwritinggreatanswers.
Draftsaved
Draftdiscarded
Signuporlogin
SignupusingGoogle
SignupusingFacebook
SignupusingEmailandPassword
Submit
Postasaguest
Name
Email
Required,butnevershown
PostYourAnswer
Discard
Byclicking“PostYourAnswer”,youagreetoourtermsofservice,privacypolicyandcookiepolicy
Nottheansweryou'relookingfor?Browseotherquestionstaggedtwitter-bootstrapreactjsoraskyourownquestion.
TheOverflowBlog
Howshardingadatabasecanmakeitfaster
FeaturedonMeta
StackExchangeQ&AaccesswillnotberestrictedinRussia
PlannedmaintenancescheduledforFriday,March18th,00:30-2:00UTC...
AnnouncinganA/BtestforaTrendingsortoption
Improvingthefirst-timeaskerexperience-Whatwasaskingyourfirst...
Related
1236
HowtomakeTwitterBootstrapmenudropdownonhoverratherthanclick
907
HowtoopenaBootstrapmodalwindowusingjQuery?
1204
CenteracolumnusingTwitterBootstrap3
1084
HowcanImakeBootstrapcolumnsallthesameheight?
789
Whatissr-onlyinBootstrap3?
950
vertical-alignwithBootstrap3
1694
LoopinsideReactJSX
1295
WhatdothesethreedotsinReactdo?
1980
ProgrammaticallynavigateusingReactrouter
928
WhatisthedifferencebetweenReactNativeandReact?
HotNetworkQuestions
Isitpossibletoaliasacommandprefixforredirectingstdout?
Isitabadsign?Searchcommitteedidnoteverreachouttoreferences,evenbeforeandaftercampusvisit
Canaverybrightlightattractanincominglaserguidedweapon?
QGISremovenumberfromthestringdoesn'tworkasexpected
"Whoever"or"whomever"
Filepermissionnumericalvalueof"rws"
MeasuringACvoltageatthepanel-whyavoidmeasuringfromneutral?
WhyisthepresidentofUkrainegivinguponNATOmembershipthisearlyinthewar
WhathappenswhentheAidspellendsonacreaturewhileitshitpointmaximumhasbeenchangedtoanothervalue?
Isthereagenerictermfortablesandviews?
WhoisDumbledorecallingthe"wrongman"whenheaccusesFudge?
Whatistheapparentcontradictioninthisintegral?
WhatisthedistinctionbetweenMonstrositiesandBeasts?
Sortnumbersinaraggedlist
Howdoesteachingexperiencehelpfieldexpertstobecomemoresuccesful?
Acolorfulaffixriddle
Do0.2vs0.5mlepitubesrequiredifferentPCRmachines,incubators,etc?
Howdoyouapproachsolvingforlatticeconstants(a,b,andc)fororthorhombicstructuresusingQuantumEspresso?
ComponentToleranceProbability
Zipunevenlists
Multiplecomparisonsw/o"als"
Howtoplacecertainpiecesona5x5chessboardwithoutanyofthemattackingeachother?
WhatdidTolkienmeanbythisawkwardsentencestructure?
AknotinthesolidtorusandaMazurmanifold
morehotquestions
Questionfeed
SubscribetoRSS
Questionfeed
TosubscribetothisRSSfeed,copyandpastethisURLintoyourRSSreader.
lang-js
Yourprivacy
Byclicking“Acceptallcookies”,youagreeStackExchangecanstorecookiesonyourdeviceanddiscloseinformationinaccordancewithourCookiePolicy.
Acceptallcookies
Customizesettings