Татаж авах
Эмхэтгэсэн CSS болон JavaScript, эх кодыг авах эсвэл npm, RubyGems гэх мэт дуртай багц менежерүүддээ оруулахын тулд Bootstrap-г татаж аваарай.
CSS болон JS эмхэтгэсэн
Bootstrap v5.1.3 -ын ашиглахад бэлэн эмхэтгэсэн кодыг татаж аваад төсөлдөө хялбархан оруулаарай. Үүнд:
- Эмхэтгэсэн болон жижигрүүлсэн CSS багцууд ( CSS файлуудын харьцуулалтыг үзнэ үү )
- Эмхэтгэсэн болон жижигрүүлсэн JavaScript залгаасууд ( JS файлуудын харьцуулалтыг үзнэ үү )
Үүнд баримт бичиг, эх файлууд эсвэл Поппер гэх мэт нэмэлт JavaScript хамаарлууд ороогүй болно.
Эх файлууд
Манай эх сурвалж Sass, JavaScript болон баримт бичгийн файлуудыг татаж авах замаар Bootstrap-ийг өөрийн хөрөнгийн шугамаар хөрвүүлээрэй. Энэ сонголт нь зарим нэмэлт хэрэгсэл шаарддаг:
- Sass эх файлуудыг CSS файл болгон хөрвүүлэх Sass хөрвүүлэгч
- CSS үйлдвэрлэгчийн угтвар тавих автомат угтвар
Хэрэв танд манай бүтээх хэрэгслүүдийн бүрэн багц шаардлагатай бол тэдгээр нь 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-г ашиглаж байгаа бөгөөд Попперыг тусад нь оруулахыг илүүд үзэж байгаа бол CDN-ээр дамжуулан манай JS-ийн өмнө Попперыг нэмэх нь дээр.
<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
Bootstrap-ийг npm багц бүхий Node.js-тэй программдаа суулгана уу :
npm install bootstrap
const bootstrap = require('bootstrap')
эсвэл Bootstrap-ийн бүх залгаасуудыг объект import bootstrap from 'bootstrap'
руу ачаалах болно . bootstrap
Модуль bootstrap
нь өөрөө манай бүх залгаасуудыг экспортлодог. /js/dist/*.js
Та багцын дээд түвшний лавлах дор байгаа файлуудыг ачаалснаар Bootstrap-ийн залгаасуудыг гараар ачаалж болно .
Bootstrap package.json
нь дараах товчлууруудын доор нэмэлт мета өгөгдлийг агуулдаг:
sass
- Bootstrap-ийн үндсэн Sass эх файлын замstyle
- өгөгдмөл тохиргоог ашиглан урьдчилан бэлтгэсэн Bootstrap-ийн жижигрүүлсэн CSS-ийн зам (өөрчлөхгүй)
утас
Bootstrap-ийг утаснуудын багц бүхий Node.js-ээр ажилладаг програмууддаа суулгана уу :
yarn add bootstrap
RubyGems
Bootstrap-ийг Ruby програмдаа Bundler ( зөвлөдөг ) болон RubyGems ашиглан суулгаж , дараах мөрийг өөрийн Gemfile
.
gem 'bootstrap', '~> 5.1.3'
Эсвэл, хэрэв та Bundler ашигладаггүй бол дараах тушаалыг ажиллуулж үнэт чулууг суулгаж болно.
gem install bootstrap -v 5.1.3
Дэлгэрэнгүй мэдээллийг эрдэнийн чулууны README- г үзнэ үү.
Хөгжмийн зохиолч
Та мөн Composer ашиглан Bootstrap-ийн Sass болон JavaScript-г суулгаж, удирдах боломжтой :
composer require twbs/bootstrap:5.1.3
NuGet
Хэрэв та .NET дээр хөгжүүлбэл NuGet ашиглан Bootstrap-ийн CSS эсвэл Sass болон JavaScript -г суулгаж, удирдах боломжтой :
Install-Package bootstrap
Install-Package bootstrap.sass