Baasa

Yiga engeri y'okussaamu Bootstrap mu pulojekiti yo ng'okozesa Parcel.

Ku muko guno

Teekamu Parcel

Teeka mu nkola ya Bootstrap

Teeka bootstrap nga module ya Node.js nga okozesa npm.

Bootstrap esinziira ku Popper , eragiddwa mu peerDependencieskintu. Kino kitegeeza nti ojja kuba olina okukakasa nti byombi obigatta ku package.jsonnkozesa yo npm install @popperjs/core.

Byonna bwe binaaggwa, pulojekiti yo ejja kusengekebwa bweti:

project-name/
├── build/
├── node_modules/
│   └── bootstrap/
│   └── popper.js/
├── scss/
│   └── custom.scss
├── src/
│   └── index.html
│   └── index.js
└── package.json

Okuyingiza JavaScript

Yingiza JavaScript ya Bootstrap mu kifo app yo w'eyingira (ebiseera ebisinga src/index.js). Osobola okuyingiza plugins zaffe zonna mu file emu oba okwawukana singa oba weetaaga subset yokka ku zo.

// Import all plugins
import * as bootstrap from 'bootstrap';

// Or import only needed plugins
import { Tooltip as Tooltip, Toast as Toast, Popover as Popover } from 'bootstrap';

// Or import just one
import Alert as Alert from '../node_modules/bootstrap/js/dist/alert';

Okuyingiza CSS

Okukozesa obusobozi bwonna obwa Bootstrap n’okubulongoosa okusinziira ku byetaago byo, kozesa fayiro z’ensibuko ng’ekitundu ku nkola ya pulojekiti yo ey’okugatta.

Tonda eyiyo scss/custom.scssokuyingiza fayiro za Sass eza Bootstrap n'oluvannyuma okyuse enkyukakyuka ez'ennono ezizimbibwamu .

Zimba app

Muteekemu nga tonnaba kussaako tag src/index.jsy’okuggalawo .</body>

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
  </head>
  <body>
    <script src="./index.js"></script>
  </body>
</html>

Okugolola`package.json`

Okwongerako devne buildscripts mu package.jsonfayiro yo.

"scripts": {
  "dev": "parcel ./src/index.html",
  "prebuild": "npx rimraf build",
  "build": "parcel build --public-url ./ ./src/index.html --experimental-scope-hoisting --out-dir build"
}

Kozesa ekiwandiiko kya dev

App yo ejja kuba efunibwa ku http://127.0.0.1:1234.

npm run dev

Zimba fayiro za app

Fayiro ezizimbibwa ziri mu build/folda.

npm run build