in English

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.5.3 ukuwela ngokulula kwiprojekthi yakho, ebandakanya:

  • Imiqulu yeCSS ehlanganisiweyo kunye nencitshisiweyo (jonga uthelekiso lweefayile zeCSS )
  • Iiplagi zeJavaScript ezihlanganisiweyo nezincitshisiweyo

Oku akubandakanyi uxwebhu, iifayile zemvelaphi, okanye naziphi na izixhomekeke kwiJavaScript ekhethiweyo (jQuery kunye nePopper.js).

Khuphela

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 (iLibsass okanye iRuby Sass iyaxhaswa) ukuze uqulunqe iCSS yakho.
  • I- Autoprefixer ye-CSS yomthengisi isimaphambili

Ukuba ufuna izixhobo zokwakha , zibandakanyiwe ekuphuhliseni i-Bootstrap kunye nee-docs zayo, kodwa azifanelanga iinjongo zakho.

Khuphela umthombo

Imizekelo

Ukuba ufuna ukukhuphela kwaye ujonge imizekelo yethu , ungabamba imizekelo esele yakhiwe:

Khuphela Imizekelo

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-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>

Ukuba usebenzisa iJavaScript yethu ehlanganisiweyo kwaye ukhetha ukubandakanya iiPopper.js ngokwahlukeneyo, yongeza iPopper.js phambi kweJS yethu, usebenzisa iCDN ngokukhethekayo.

<script src="https://code.jquery.com/jquery-3.5.1.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-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s" crossorigin="anonymous"></script>

Abaphathi bephakheji

Tsala iifayile zomthombo weBootstrap phantse kuyo nayiphi na iprojekthi enabaphathi bephakheji 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 bootstrapngokwayo ayithumeleli nantoni na. Uyakwazi ukulayisha ngesandla iiplagi ze-Bootstrap zejQuery nganye ngokulayisha /js/*.jsiifayile phantsi kolawulo lomgangatho ophezulu wephakheji.

I-Bootstrap's package.jsoniqulethe i-metadata eyongezelelweyo phantsi kwezi zitshixo zilandelayo:

  • sass- indlela eya kwiBootstrap eyona fayile yomthombo weSass
  • style-indlela eya kwi-Bootstrap's non-minified CSS esele ihlanganiswe kusetyenziswa useto olungagqibekanga (akukho ngokwezifiso)

umsonto

Faka i-Bootstrap kwi-Node.js usetyenziso olunikwe amandla ngepakethi yomsonto :

yarn add bootstrap

RubyGems

Faka iBootstrap kwii -apps zakho zeRuby usebenzisa iBundler ( iyacetyiswa ) kunye neRubyGems ngokongeza lo mgca ulandelayo kweyakho Gemfile:

gem 'bootstrap', '~> 4.5.3'

Kungenjalo, ukuba awusebenzisi i-Bundler, ungafaka i-gem ngokusebenzisa lo myalelo:

gem install bootstrap -v 4.5.3

Jonga gem's FUNDA ngeenkcukacha ezithe vetshe.

Umqambi

Unokufaka kwaye ulawule iSass yeBootstrap kunye neJavaScript usebenzisa uMqambi :

composer require twbs/bootstrap:4.5.3

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