Төп эчтәлеккә күчү Документлар навигациясенә күчү
in English

Йөкләү

Компиляцияләнгән CSS һәм JavaScript, чыганак коды алу өчен Bootstrap-ны йөкләү, яки npm, RubyGems һәм башкалар кебек яраткан пакет менеджерларыгыз белән кертү.

CSS һәм JS тупланган

Сезнең проектка җиңел төшү өчен Bootstrap v5.1.3 өчен әзер компиляцияләнгән кодны йөкләгез, ул үз эченә ала:

Бу документлар, чыганак файллары яки Popper кебек өстәмә JavaScript бәйләнешләрен кертми.

Йөкләү

Чыганак файллары

Bootstrap-ны үзегезнең актив торбагыз белән туплагыз, безнең чыганак Sass, JavaScript һәм документлар файлларын йөкләп. Бу вариант өстәмә кораллануны таләп итә:

Әгәр дә сез безнең тулы кораллар җыелмасын таләп итсәгез , алар Bootstrap һәм аның документларын үстерү өчен кертелгән, ләкин алар сезнең максатларыгыз өчен яраксыз.

Йөкләү чыганагы

Мисаллар

Әгәр дә сез безнең мисалларны йөкләргә һәм тикшерергә телисез икән , сез инде төзелгән мисалларны ала аласыз:

Мисалларны йөкләү

JsDelivr аша CDN

Bootstrap-ның тупланган CSS һәм JS-ның кэшланган версиясен сезнең проектка җиткерү өчен jsDelivr белән йөкләүдән баш тартыгыз.

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>

Әгәр дә сез безнең тупланган JavaScript кулланасыз һәм Popper-ны аерым кертергә телисез икән, CDN аша безнең JS алдыннан Popper-ны өстәгез.

<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-7+zCNj/IqJ95wo16oMtfsKbZ9ccEh31eOz1HGyDuCQ6wgnyJNSYdrPa03rtR1zdB" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13" crossorigin="anonymous"></script>

Пакет менеджерлары

Bootstrap чыганак файлларын иң популяр пакет менеджерлары белән теләсә нинди проектка тарт. Пакет менеджерына карамастан, Bootstrap безнең рәсми тупланган версияләргә туры килгән көйләү өчен Sass компиляциясе һәм Autoprefixer таләп итә .

npm

Node.js белән эшләнгән кушымталарга Bootstrap урнаштырыгыз : npm пакеты белән :

npm install bootstrap

const bootstrap = require('bootstrap')яки import bootstrap from 'bootstrap'Bootstrap-ның барлык плагиннарын bootstrapобъектка йөкләячәк. bootstrapМодуль үзе безнең барлык плагиннарны экспортлый . Сез Bootstrap плагиннарын кул белән йөкли аласыз /js/dist/*.js, пакетның иң югары каталог астындагы файлларны йөкләп.

Bootstrap'та package.jsonтүбәндәге ачкычлар астында өстәмә мета-мәгълүматлар бар:

  • sass- Bootstrap-ның төп Sass чыганак файлына юл
  • style- Bootstrap-ның минималь булмаган CSS-ка юл, бу килешү көйләнмәләре ярдәмендә тупланган (көйләү юк)
Bootstrap белән npm аша безнең стартер проект белән башлап җибәрегез! Bootstrap-ны үзегезнең npm проектында ничек төзергә һәм көйләргә икәнлеген карау өчен twbs / bootstrap-npm-стартер шаблон репозитариясенә керегез. Sass компиляциясе, Autoprefixer, Stylelint, PurgeCSS һәм Bootstrap иконалары керә.

җеп

Bootstrap-ны Node.js белән эшләнгән кушымталарга җеп пакеты белән урнаштырыгыз :

yarn add bootstrap

RubyGems

Сезнең Ruby кушымталарына Bootstrap урнаштырыгыз ( тәкъдим ителә ) һәм RubyGems ярдәмендә түбәндәге юлны өстәп :Gemfile

gem 'bootstrap', '~> 5.1.3'

Яисә, Бундлер кулланмыйсыз икән, сез бу боерыкны кулланып асылташны урнаштыра аласыз:

gem install bootstrap -v 5.1.3

Тулырак мәгълүмат өчен асылташның README карагыз .

Композитор

Сез шулай ук ​​Bootstrap's Sass һәм JavaScript-ны композитор ярдәмендә урнаштыра аласыз :

composer require twbs/bootstrap:5.1.3

NuGet

Әгәр сез .NET системасында үсеш алсагыз, NuGet ярдәмендә Bootstrap CSS яки Sass һәм JavaScript урнаштыра аласыз :

Install-Package bootstrap
Install-Package bootstrap.sass