Source

בניית כלים

למד כיצד להשתמש בתסריטי npm הכלולים של Bootstrap כדי לבנות את התיעוד שלנו, להדר קוד מקור, להריץ בדיקות ועוד.

הגדרת כלי עבודה

Bootstrap משתמש בסקריפטים של NPM עבור מערכת הבנייה שלה. ה- package.json שלנו כולל שיטות נוחות לעבודה עם המסגרת, כולל קומפילציה של קוד, הפעלת בדיקות ועוד.

כדי להשתמש במערכת הבנייה שלנו ולהפעיל את התיעוד שלנו באופן מקומי, תזדקק לעותק של קובצי המקור והצומת של Bootstrap. בצע את השלבים הבאים ואתה אמור להיות מוכן לרוק:

  1. הורד והתקן את Node.js , שבו אנו משתמשים כדי לנהל את התלות שלנו.
  2. נווט אל ספריית השורש /bootstrapוהפעל npm installכדי להתקין את התלות המקומית שלנו הרשומה ב- package.json .
  3. התקן את Ruby , התקן Bundler עם gem install bundlerולבסוף הפעל bundle install. פעולה זו תתקין את כל התלות של Ruby, כגון Jekyll ותוספים.

לאחר השלמתו, תוכל להפעיל את הפקודות השונות שסופקו משורת הפקודה.

שימוש בסקריפטים של NPM

package.json שלנו כולל את הפקודות והמשימות הבאות:

מְשִׁימָה תיאור
npm run dist npm run distיוצר את /distהספרייה עם קבצי קומפילציה. משתמש ב- Sass , Autoprefixer ו- UglifyJS .
npm test אותו דבר כמו npm run distפלוס זה מריץ בדיקות מקומית
npm run docs בונה ומחבר CSS ו-JavaScript עבור מסמכים. לאחר מכן תוכל להפעיל את התיעוד באופן מקומי באמצעות npm run docs-serve.

הפעל npm runכדי לראות את כל הסקריפטים של npm.

Autoprefixer

Bootstrap משתמש ב- Autoprefixer (כלול בתהליך הבנייה שלנו) כדי להוסיף אוטומטית קידומות של ספקים לחלק ממאפייני ה-CSS בזמן הבנייה. פעולה זו חוסכת לנו זמן וקוד בכך שהיא מאפשרת לנו לכתוב חלקים מרכזיים מה-CSS שלנו פעם אחת תוך ביטול הצורך במיקסינים של ספקים כמו אלה שנמצאים ב-v3.

אנו שומרים על רשימת הדפדפנים הנתמכים באמצעות Autoprefixer בקובץ נפרד בתוך מאגר GitHub שלנו. ראה /package.json לפרטים.

תיעוד מקומי

הפעלת התיעוד שלנו מקומית דורשת שימוש ב-Jekyll, מחולל אתרים סטטי גמיש והוגן שמספק לנו: כולל בסיסי, קבצים מבוססי Markdown, תבניות ועוד. הנה איך להתחיל את זה:

  1. הפעל דרך הגדרת הכלים שלמעלה כדי להתקין את Jekyll (בונה האתרים) ותלויות Ruby אחרות עם bundle install.
  2. מספריית השורש /bootstrap, הפעל npm run docs-serveבשורת הפקודה.
  3. פתח http://localhost:9001בדפדפן שלך, והרי.

למד עוד על השימוש ב- Jekyll על ידי קריאת התיעוד שלה .

פתרון תקלות

אם תיתקל בבעיות בהתקנת תלות, הסר את כל גרסאות התלות הקודמות (גלובליות ומקומיות). לאחר מכן, הפעל מחדש npm install.