Hoʻoiho
Hoʻoiho iā Bootstrap e kiʻi i ka CSS i hui ʻia a me JavaScript, kumu kumu, a i ʻole e hoʻokomo pū me kāu mau pūʻulu punahele punahele e like me npm, RubyGems, a me nā mea hou aku.
CSS a me JS i houluuluia
Hoʻoiho i ke code i hoʻohui ʻia no Bootstrap v4.6.2 e hoʻoiho maʻalahi i kāu papahana, e komo pū ana:
- Nā pūʻolo CSS i hōʻuluʻulu ʻia a liʻiliʻi (e ʻike i ka hoʻohālikelike o nā faila CSS )
- Nā plugins JavaScript i hōʻuluʻulu ʻia a liʻiliʻi (e ʻike i ka hoʻohālikelike faila JS )
ʻAʻole pili kēia i nā palapala, nā waihona kumu, a i ʻole nā mea hilinaʻi JavaScript koho (jQuery a me Popper).
Nā waihona kumu
Hoʻopili i ka Bootstrap me kāu pipeline waiwai ponoʻī ma ka hoʻoiho ʻana i kā mākou kumu Sass, JavaScript, a me nā faila palapala. Pono kēia koho i kekahi mau mea hana hou:
- Sass compiler no ka hōʻuluʻulu ʻana i nā faila kumu Sass i nā faila CSS
- Autoprefixer no ka CSS mea kūʻai prefixing
Inā makemake ʻoe i kā mākou pūʻulu piha o nā mea hana kūkulu , ua hoʻokomo ʻia lākou no ka hoʻomohala ʻana iā Bootstrap a me kāna mau palapala, akā ʻaʻole kūpono lākou no kāu mau kumu ponoʻī.
Nā laʻana
Inā makemake ʻoe e hoʻoiho a nānā i kā mākou mau laʻana , hiki iā ʻoe ke hopu i nā hiʻohiʻona i kūkulu ʻia:
jsDelivr
Hoʻokuʻu i ka hoʻoiho ʻana me jsDelivr e hāʻawi i ka mana huna o kā Bootstrap CSS a me JS i hui pū ʻia i kāu papahana.
<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>
Inā ʻoe e hoʻohana nei i kā mākou JavaScript i hōʻuluʻulu ʻia a makemake ʻoe e hoʻokomo iā Popper i kahi kaʻawale, e hoʻohui iā Popper ma mua o kā mākou JS, ma o kahi CDN ʻoi aku ka maikaʻi.
<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>
Nā luna pūʻolo
Huki i nā faila kumu o Bootstrap i loko o kahi papahana me kekahi o nā mana hoʻokele kaulana loa. ʻAʻole pili i ka luna pūʻolo, e koi ʻo Bootstrap i kahi Sass compiler a me Autoprefixer no kahi hoʻonohonoho e kūlike i kā mākou mau mana i hui pū ʻia.
npm
E hoʻouka i ka Bootstrap i kāu mau polokalamu mana Node.js me ka pūʻolo npm :
npm install bootstrap
require('bootstrap')
e hoʻouka i nā plugins jQuery a pau o Bootstrap i ka mea jQuery. bootstrap
ʻAʻole hoʻokuke aku ka module i kekahi mea . Hiki iā ʻoe ke hoʻouka lima i nā plugins jQuery o Bootstrap i kēlā me kēia ma ka hoʻouka ʻana i nā /js/*.js
faila ma lalo o ka papa kuhikuhi kiʻekiʻe o ka pūʻolo.
Aia i loko o Bootstrap package.json
kekahi mau metadata hou ma lalo o nā kī aʻe:
sass
- ala i ka waihona kumu Sass nui o Bootstrapstyle
- ke ala i ka CSS non-minified o Bootstrap i hoʻonohonoho mua ʻia me ka hoʻohana ʻana i nā hoʻonohonoho paʻamau (ʻaʻohe hana maʻamau)
wili
E hoʻouka i ka Bootstrap i kāu mau polokalamu mana Node.js me ka pūʻolo yarn :
yarn add bootstrap
RubyGems
E hoʻouka i ka Bootstrap i kāu mau polokalamu Ruby me ka hoʻohana ʻana iā Bundler ( manaʻo ʻia ) a me RubyGems ma ka hoʻohui ʻana i kēia laina i kāu Gemfile
:
gem 'bootstrap', '~> 4.6.2'
ʻO kahi ʻē aʻe, inā ʻaʻole ʻoe e hoʻohana iā Bundler, hiki iā ʻoe ke hoʻokomo i ka gem ma ka holo ʻana i kēia kauoha:
gem install bootstrap -v 4.6.2
E ʻike i ka README o ka gem no nā kikoʻī hou aku.
Mea haku mele
Hiki iā ʻoe ke hoʻouka a hoʻokele i kā Bootstrap's Sass a me JavaScript me ka hoʻohana ʻana i ka Composer :
composer require twbs/bootstrap:4.6.2
NuGet
Inā hoʻomohala ʻoe ma .NET, hiki iā ʻoe ke hoʻouka a mālama i kā Bootstrap CSS a i ʻole Sass a me JavaScript me ka hoʻohana ʻana iā NuGet :
Install-Package bootstrap
Install-Package bootstrap.sass