Lopango
Yekola ndenge nini okoki kotia Bootstrap na projet na yo na kosalelaka Parcel.
Botia Parcelle
Botia Paquet ya Parcelle .
Botia na esika bakomi Bootstrap
Botia bootstrap lokola module ya Node.js na kosalelaka npm.
Bootstrap etali Popper , oyo elakisami na peerDependencies
propriété. Yango elingi koloba ete ekosɛnga osala makasi mpo na kobakisa yango nyonso mibale na ndenge oyo package.json
osaleli npm install @popperjs/core
.
Tango nionso ekosila, projet na yo ekozala structuré boye:
project-name/
├── build/
├── node_modules/
│ └── bootstrap/
│ └── popper.js/
├── scss/
│ └── custom.scss
├── src/
│ └── index.html
│ └── index.js
└── package.json
Kokɔtisa JavaScript na kati
Importer JavaScript ya Bootstrap na point d’entrée ya app na yo (mingi mingi src/index.js
). Okoki ko importer ba plugins na biso nionso na fichier moko to separatement soki oza na besoin kaka sous-ensemble na yango.
// 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';
Kokɔtisa CSS na mboka mopaya
Mpo na kosalela makoki nyonso ya Bootstrap mpe kosala yango na kotalela bamposa na yo, salelá bafichiers ya source lokola eteni ya mosala ya kosala bosangisi ya mosala na yo.
Salá ya yo moko scss/custom.scss
mpo na kokɔtisa ba fichiers Sass ya Bootstrap mpe na nsima kolongola ba variables personnalisées oyo etongami na kati .
Tongela app
Botia yango liboso ya tag src/index.js
ya bokangami .</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>
Kokomapackage.json
Bakisa dev
mpe ba build
scripts na package.json
fichier na 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"
}
Tambwisa script ya dev
Application na yo ekozala accessible na http://127.0.0.1:1234
.
npm run dev
Tongela ba fichiers ya app
Ba fichiers oyo etongami ezali na kati ya build/
dossier.
npm run build