Bawm
Parcel hmanga i project-a Bootstrap telh dan zir rawh.
Parcel dah tur a ni
Parcel Bundler chu dah rawh .
Bootstrap chu install rawh
bootstrap chu Node.js module angin npm hmangin install rawh.
Bootstrap hi Popper ah a innghat a , chu chu peerDependencies
property ah hian tarlan a ni. package.json
Chumi awmzia chu i hmannaah an pahnih hian i belh ngei ngei tur a ni tihna a npm install @popperjs/core
ni .
A zawng zawng a zawh hunah chuan i project chu hetiang hian a insiam ang:
project-name/
├── build/
├── node_modules/
│ └── bootstrap/
│ └── popper.js/
├── scss/
│ └── custom.scss
├── src/
│ └── index.html
│ └── index.js
└── package.json
JavaScript import dan tur
I app entry point-ah Bootstrap-a JavaScript import rawh (a tlangpuiin src/index.js
). Kan plugin zawng zawng hi file pakhatah emaw, a hranin emaw i import thei a, chu chu subset chauh i mamawh chuan.
// 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';
CSS import mek a ni
Bootstrap thiltihtheihna zawng zawng hmang tangkai tur leh i mamawh ang zela siam tur chuan source files te chu i project bundling process ah hmang la.
Bootstrap-a Sass files importscss/custom.scss
tur chuan nangmah ngeiin siam la , chutah chuan built-in custom variables te chu override rawh .
App siam rawh
Closing tag src/index.js
hmain dah tel bawk ang che .</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>
Siamthapackage.json
Add dev
leh build
scripts te chu i package.json
file ah a awm.
"scripts": {
"dev": "parcel ./src/index.html",
"prebuild": "npx rimraf build",
"build": "parcel build --public-url ./ ./src/index.html --experimental-scope-hoisting --out-dir build"
}
Dev script chu run rawh
I app chu http://127.0.0.1:1234
.
npm run dev
App file siam dan tur
Built file te chu build/
folder ah a awm a.
npm run build