Khuphela
Khuphela i-Bootstrap ukuze ufumane i-CSS ehlanganisiweyo kunye neJavaScript, ikhowudi yomthombo, okanye uyifake kunye nabaphathi bephakheji obathandayo njenge-npm, i-RubyGems, kunye nokunye.
I-CSS ehlanganisiweyo kunye ne-JS
Khuphela ikhowudi esele ilungele ukusetyenziswa yeBootstrap v4.6.2 ukuwela ngokulula kwiprojekthi yakho, ebandakanya:
- Imiqulu yeCSS ehlanganisiweyo kunye nencitshisiweyo (jonga uthelekiso lweefayile zeCSS )
- Iiplagi zeJavaScript ezihlanganisiweyo nezincitshisiweyo (jonga uthelekiso lweefayile zeJS )
Oku akubandakanyi uxwebhu, iifayile zemvelaphi, okanye naluphi na uxhomekeko olukhethiweyo lweJavaScript (jQuery kunye nePopper).
Iifayile zomthombo
Qokelela i-Bootstrap kunye nombhobho we-asethi yakho ngokukhuphela umthombo wethu we-Sass, iJavaScript, kunye neefayile zamaxwebhu. Olu khetho lufuna isixhobo esongezelelweyo:
- Umqokeleli weSass wokuqulunqa iifayile zeSass kwiifayile zeCSS
- I- Autoprefixer ye-CSS yomthengisi isimaphambili
Ukuba ufuna iseti yethu epheleleyo yezixhobo zokwakha , zibandakanyiwe ekuphuhliseni i-Bootstrap kunye nee-docs zayo, kodwa kusenokwenzeka ukuba azilungelanga iinjongo zakho.
Imizekelo
Ukuba ufuna ukukhuphela kwaye ujonge imizekelo yethu , ungabamba imizekelo esele yakhiwe:
jsDelivr
Tsiba ukhuphelo ngejsDelivr ukuhambisa uguqulelo olugciniweyo lweBootstrap eqokelelweyo yeCSS kunye neJS kwiprojekthi yakho.
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script>
Ukuba usebenzisa iJavaScript yethu ehlanganisiweyo kwaye ukhetha ukubandakanya iPopper ngokwahlukeneyo, yongeza iPopper phambi kweJS yethu, ngeCDN ngokukhethekayo.
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-+sLIOodYLS7CIrQpBjl+C7nPvqq+FbNUBDunl/OZv93DB7Ln/533i8e/mZXLi/P+" crossorigin="anonymous"></script>
Abaphathi bephakheji
Tsala iifayile zomthombo weBootstrap phantse kuyo nayiphi na iprojekthi enabaphathi bepakethe abadumileyo. Kungakhathaliseki ukuba umphathi wephakheji, i-Bootstrap iya kufuna i- Sass compiler kunye ne - Autoprefixer yokuseta oluhambelana neenguqulelo zethu ezisemthethweni ezihlanganisiweyo.
npm
Faka i-Bootstrap kwi-apps yakho ye-Node.js ene -npm package :
npm install bootstrap
require('bootstrap')
izakulayisha zonke iiplagi zeBootstrap zejQuery kwinto yejQuery. Imodyuli bootstrap
ngokwayo ayithumeleli nantoni na. Uyakwazi ukulayisha ngesandla iiplagi ze-Bootstrap zejQuery nganye ngokulayisha /js/*.js
iifayile phantsi kolawulo lomgangatho ophezulu wephakheji.
I-Bootstrap's package.json
iqulethe i-metadata eyongezelelweyo phantsi kwezi zitshixo zilandelayo:
sass
- indlela eya kwiBootstrap eyona fayile yomthombo weSassstyle
-indlela eya kwi-Bootstrap's non-minified CSS eye yaqulunqwa kusetyenziswa useto olungagqibekanga (akukho ngokwezifiso)
umsonto
Faka i-Bootstrap kwi-Node.js usetyenziso olunikwe amandla ngepakethe yomsonto :
yarn add bootstrap
RubyGems
Faka i-Bootstrap kwii -apps zakho zeRuby usebenzisa iBundler ( iyacetyiswa ) kunye neRubyGems ngokongeza lo mgca ulandelayo kweyakho Gemfile
:
gem 'bootstrap', '~> 4.6.2'
Kungenjalo, ukuba awusebenzisi i-Bundler, ungafaka i-gem ngokusebenzisa lo myalelo:
gem install bootstrap -v 4.6.2
Jonga gem's FUNDA ngeenkcukacha ezithe vetshe.
Umqambi
Unokufaka kwaye ulawule iSass yeBootstrap kunye neJavaScript usebenzisa uMqambi :
composer require twbs/bootstrap:4.6.2
NuGet
Ukuba uphuhlisa kwi.NET, ungafaka kwaye ulawule iBootstrap's CSS okanye iSass kunye neJavaScript usebenzisa i- NuGet :
Install-Package bootstrap
Install-Package bootstrap.sass