פּעקל

לערנען ווי צו אַרייַננעמען Bootstrap אין דיין פּרויעקט ניצן פּאַרסעל.

אויף דעם בלאַט

ינסטאַלירן פּעקל

ינסטאַלירן Bootstrap

ינסטאַלירן באָאָטסטראַפּ ווי אַ Node.js מאָדולע ניצן npm.

באָאָטסטראַפּ דעפּענדס אויף פּאָפּער , וואָס איז ספּעסיפיעד אין די peerDependenciesפאַרמאָג. דעם מיטל אַז איר וועט האָבן צו מאַכן זיכער צו לייגן ביידע צו דיין package.jsonנוצן npm install @popperjs/core.

ווען אַלע וועט זיין געענדיקט, דיין פּרויעקט וועט זיין סטראַקטשערד ווי דאָס:

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

ימפּאָרטינג דזשאַוואַסקריפּט

אַרייַנפיר באָאָטסטראַפּ ס דזשאַוואַסקריפּט אין דיין אַפּ ס פּאָזיציע פונט (יוזשאַוואַלי src/index.js). איר קענען אַרייַנפיר אַלע אונדזער פּלוגינס אין איין טעקע אָדער סעפּעראַטלי אויב איר דאַרפֿן בלויז אַ סאַבסעט פון זיי.

// 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

צו נוצן די פול פּאָטענציעל פון Bootstrap און קאַסטאַמייז עס צו דיין דאַרף, נוצן די מקור טעקעס ווי אַ טייל פון די באַנדלינג פּראָצעס פון דיין פּרויעקט.

שאַפֿן דיין אייגענע scss/custom.scssצו אַרייַנפיר Bootstrap ס סאַס טעקעס און דאַן אָווועררייד די געבויט-אין מנהג וועריאַבאַלז .

בויען אַ אַפּלאַקיישאַן

אַרייַננעמען src/index.jsאיידער די קלאָוזינג </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>

רעדאַגירן`package.json`

לייג devאון buildסקריפּס אין דיין package.jsonטעקע.

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

לויפן דעוו שריפט

דיין אַפּ וועט זיין צוטריטלעך אין http://127.0.0.1:1234.

npm run dev

בויען אַפּ טעקעס

געבויט טעקעס זענען אין דער build/טעקע.

npm run build