ଡାଉନଲୋଡ୍ କରନ୍ତୁ |
ସଙ୍କଳିତ CSS ଏବଂ ଜାଭାସ୍କ୍ରିପ୍ଟ, ଉତ୍ସ କୋଡ୍ ପାଇବା ପାଇଁ ବୁଟଷ୍ଟ୍ରାପ୍ ଡାଉନଲୋଡ୍ କରନ୍ତୁ, କିମ୍ବା npm, RubyGems, ଏବଂ ଅଧିକ ପରି ଆପଣଙ୍କର ପ୍ରିୟ ପ୍ୟାକେଜ୍ ପରିଚାଳକମାନଙ୍କ ସହିତ ଏହାକୁ ଅନ୍ତର୍ଭୂକ୍ତ କରନ୍ତୁ |
ସଂକଳିତ CSS ଏବଂ JS |
ଆପଣଙ୍କ ପ୍ରୋଜେକ୍ଟରେ ସହଜରେ ଖସିଯିବା ପାଇଁ ବୁଟଷ୍ଟ୍ରାପ୍ v5.1.3 ପାଇଁ ପ୍ରସ୍ତୁତ-ବ୍ୟବହାର-ସଂକଳିତ କୋଡ୍ ଡାଉନଲୋଡ୍ କରନ୍ତୁ, ଯେଉଁଥିରେ:
- ସଂକଳିତ ଏବଂ କ୍ଷୁଦ୍ର CSS ବଣ୍ଡଲଗୁଡିକ ( CSS ଫାଇଲ ତୁଳନା ତୁଳନା ଦେଖନ୍ତୁ )
- ସଙ୍କଳିତ ଏବଂ କ୍ଷୁଦ୍ର ଜାଭାସ୍କ୍ରିପ୍ଟ ପ୍ଲଗଇନଗୁଡିକ ( JS ଫାଇଲ ତୁଳନା ତୁଳନା କରନ୍ତୁ ) |
ଏଥିରେ ଡକ୍ୟୁମେଣ୍ଟେସନ୍, ଉତ୍ସ ଫାଇଲ୍, କିମ୍ବା ପପର୍ ପରି କ al ଣସି ଇଚ୍ଛାଧୀନ ଜାଭାସ୍କ୍ରିପ୍ଟ ନିର୍ଭରଶୀଳତା ଅନ୍ତର୍ଭୂକ୍ତ ହୁଏ ନାହିଁ |
ଉତ୍ସ ଫାଇଲଗୁଡିକ |
ଆମର ଉତ୍ସ ସାସ୍, ଜାଭାସ୍କ୍ରିପ୍ଟ, ଏବଂ ଡକ୍ୟୁମେଣ୍ଟେସନ୍ ଫାଇଲ୍ ଡାଉନଲୋଡ୍ କରି ଆପଣଙ୍କର ନିଜସ୍ୱ ସମ୍ପତ୍ତି ପାଇପଲାଇନ ସହିତ ବୁଟଷ୍ଟ୍ରାପ୍ ସଂକଳନ କରନ୍ତୁ | ଏହି ବିକଳ୍ପଟି କିଛି ଅତିରିକ୍ତ ସାଧନ ଆବଶ୍ୟକ କରେ:
- CSS ଫାଇଲଗୁଡ଼ିକରେ Sass ଉତ୍ସ ଫାଇଲଗୁଡ଼ିକୁ ସଙ୍କଳନ କରିବା ପାଇଁ Sass କମ୍ପାଇଲର୍ |
- CSS ବିକ୍ରେତା ଉପସର୍ଗ ପାଇଁ ଅଟୋଫ୍ରେଫିକ୍ସର୍ |
ଯଦି ଆପଣ ଆମର ନିର୍ମାଣ ଉପକରଣଗୁଡ଼ିକର ସମ୍ପୂର୍ଣ୍ଣ ସେଟ୍ ଆବଶ୍ୟକ କରନ୍ତି , ସେଗୁଡିକ ବୁଟଷ୍ଟ୍ରାପ୍ ଏବଂ ଏହାର ଡକସ୍ ବିକାଶ ପାଇଁ ଅନ୍ତର୍ଭୂକ୍ତ ହୋଇଛି, କିନ୍ତୁ ସେମାନେ ସମ୍ଭବତ your ଆପଣଙ୍କ ନିଜ ଉଦ୍ଦେଶ୍ୟ ପାଇଁ ଅନୁପଯୁକ୍ତ |
ଉଦାହରଣଗୁଡିକ
ଯଦି ଆପଣ ଆମର ଉଦାହରଣଗୁଡିକୁ ଡାଉନଲୋଡ୍ ଏବଂ ପରୀକ୍ଷା କରିବାକୁ ଚାହାଁନ୍ତି , ତେବେ ଆପଣ ପୂର୍ବରୁ ନିର୍ମିତ ଉଦାହରଣଗୁଡ଼ିକୁ ଧରି ପାରିବେ:
JsDelivr ମାଧ୍ୟମରେ CDN |
ତୁମର ପ୍ରୋଜେକ୍ଟରେ ବୁଟଷ୍ଟ୍ରାପ୍ ର ସଂକଳିତ 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>
ଯଦି ଆପଣ ଆମର ସଙ୍କଳିତ ଜାଭାସ୍କ୍ରିପ୍ଟ ବ୍ୟବହାର କରୁଛନ୍ତି ଏବଂ ପପର୍ କୁ ପୃଥକ ଭାବରେ ଅନ୍ତର୍ଭୂକ୍ତ କରିବାକୁ ପସନ୍ଦ କରନ୍ତି, 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>
ପ୍ୟାକେଜ୍ ପରିଚାଳକ |
କେତେକ ଲୋକପ୍ରିୟ ପ୍ୟାକେଜ୍ ମ୍ୟାନେଜର୍ ସହିତ ବୁଟଷ୍ଟ୍ରାପ୍ ର ଉତ୍ସ ଫାଇଲଗୁଡ଼ିକୁ ପ୍ରାୟ ଯେକ project ଣସି ପ୍ରୋଜେକ୍ଟରେ ଟାଣନ୍ତୁ | ପ୍ୟାକେଜ୍ ମ୍ୟାନେଜର୍ ଯାହା ହେଉନା କାହିଁକି, ବୁଟଷ୍ଟ୍ରାପ୍ ଆମର ଅଫିସିଆଲ୍ ସଙ୍କଳିତ ସଂସ୍କରଣ ସହିତ ମେଳ ଖାଉଥିବା ଏକ ସେଟଅପ୍ ପାଇଁ ଏକ ସାସ୍ କମ୍ପାଇଲର୍ ଏବଂ ଅଟୋଫ୍ରେଫିକ୍ସର୍ ଆବଶ୍ୟକ କରିବ |
npm
Npm ପ୍ୟାକେଜ୍ ସହିତ ଆପଣଙ୍କର Node.js ଚାଳିତ ଆପ୍ସରେ ବୁଟଷ୍ଟ୍ରାପ୍ ସଂସ୍ଥାପନ କରନ୍ତୁ :
npm install bootstrap
const bootstrap = require('bootstrap')
କିମ୍ବା ବୁଟଷ୍ଟ୍ରାପ୍ ର ସମସ୍ତ ପ୍ଲଗଇନ୍ ଏକ ବସ୍ତୁ import bootstrap from 'bootstrap'
ଉପରେ ଲୋଡ୍ କରିବ | ମଡ୍ୟୁଲ୍ ନିଜେ ଆମର ସମସ୍ତ ପ୍ଲଗଇନ୍ ରପ୍ତାନି କରେ bootstrap
| ପ୍ୟାକେଜ୍ ର ଶୀର୍ଷ ସ୍ତରୀୟ ଡିରେକ୍ଟୋରୀରେ bootstrap
ଥିବା ଫାଇଲଗୁଡ଼ିକୁ ଲୋଡ୍ କରି ଆପଣ ବୁଟଷ୍ଟ୍ରାପ୍ ର ପ୍ଲଗଇନଗୁଡ଼ିକୁ ବ୍ୟକ୍ତିଗତ ଭାବରେ ଲୋଡ୍ କରିପାରିବେ |/js/dist/*.js
package.json
ନିମ୍ନଲିଖିତ କିଗୁଡ଼ିକ ତଳେ ବୁଟଷ୍ଟ୍ରାପ୍ କିଛି ଅତିରିକ୍ତ ମେଟାଡାଟା ଧାରଣ କରିଥାଏ :
sass
- ବୁଟଷ୍ଟ୍ରାପ୍ ର ମୁଖ୍ୟ ସାସ୍ ଉତ୍ସ ଫାଇଲ୍ ପାଇଁ ପଥ |style
- ବୁଟଷ୍ଟ୍ରାପ୍ ର ଅଣ-ମାଇନିଫାଏଡ୍ CSS ପାଇଁ ପଥ ଯାହା ଡିଫଲ୍ଟ ସେଟିଂସମୂହ ବ୍ୟବହାର କରି ସଂକଳିତ ହୋଇଛି (କ custom ଣସି କଷ୍ଟମାଇଜେସନ୍ ନାହିଁ) |
ସୂତା
ସୂତା ପ୍ୟାକେଜ୍ ସହିତ ଆପଣଙ୍କର Node.js ଚାଳିତ ଆପ୍ସରେ ବୁଟଷ୍ଟ୍ରାପ୍ ସଂସ୍ଥାପନ କରନ୍ତୁ :
yarn add bootstrap
RubyGems
ନିମ୍ନଲିଖିତ ରେଖା ଯୋଗ କରି ବୁଣ୍ଡଲର୍ ( ସୁପାରିଶ ) ଏବଂ ରୁବିଗେମ୍ ବ୍ୟବହାର କରି ତୁମର ରୁବି ଆପରେ ବୁଟଷ୍ଟ୍ରାପ୍ ସଂସ୍ଥାପନ କର Gemfile
:
gem 'bootstrap', '~> 5.1.3'
ବ ly କଳ୍ପିକ ଭାବରେ, ଯଦି ଆପଣ ବଣ୍ଡଲର୍ ବ୍ୟବହାର କରୁନାହାଁନ୍ତି, ତେବେ ଆପଣ ଏହି ନିର୍ଦ୍ଦେଶକୁ ଚଲାଇ ରତ୍ନ ସଂସ୍ଥାପନ କରିପାରିବେ:
gem install bootstrap -v 5.1.3
ଅଧିକ ବିବରଣୀ ପାଇଁ ରତ୍ନର README ଦେଖନ୍ତୁ |
ରଚନା
ଆପଣ କମ୍ପୋଜର ବ୍ୟବହାର କରି ବୁଟଷ୍ଟ୍ରାପ୍ ର ସାସ୍ ଏବଂ ଜାଭାସ୍କ୍ରିପ୍ଟ ମଧ୍ୟ ସଂସ୍ଥାପନ ଏବଂ ପରିଚାଳନା କରିପାରିବେ :
composer require twbs/bootstrap:5.1.3
NuGet
ଯଦି ଆପଣ .NET ରେ ବିକାଶ କରନ୍ତି, ତେବେ ଆପଣ NuGet ବ୍ୟବହାର କରି ବୁଟଷ୍ଟ୍ରାପ୍ ର CSS କିମ୍ବା ସାସ୍ ଏବଂ ଜାଭାସ୍କ୍ରିପ୍ଟ ମଧ୍ୟ ସଂସ୍ଥାପନ ଏବଂ ପରିଚାଳନା କରିପାରିବେ :
Install-Package bootstrap
Install-Package bootstrap.sass