בויען מכשירים
לערנען ווי צו נוצן Bootstrap ס ינקלודעד npm סקריפּס צו בויען אונדזער דאַקיומענטיישאַן, צונויפנעמען מקור קאָד, לויפן טעסץ און מער.
מכשירים סעטטינגס
Bootstrap ניצט npm סקריפּס פֿאַר זיין בויען סיסטעם. אונדזער package.json כולל באַקוועם מעטהאָדס פֿאַר ארבעטן מיט די פריימווערק, אַרייַנגערעכנט קאַמפּיילינג קאָד, פליסנדיק טעסץ און מער.
צו נוצן אונדזער בויען סיסטעם און לויפן אונדזער דאַקיומענטיישאַן לאָוקאַלי, איר דאַרפֿן אַ קאָפּיע פון באָאָטסטראַפּ ס מקור טעקעס און נאָדע. גיי די סטעפּס און איר זאָל זיין גרייט צו שטיין:
- אראפקאפיע און ינסטאַלירן Node.js , וואָס מיר נוצן צו פירן אונדזער דיפּענדאַנסיז.
- אָדער אראפקאפיע Bootstrap ס קוואלן אָדער גאָפּל Bootstrap ס ריפּאַזאַטאָרי .
- נאַוויגירן צו דער וואָרצל
/bootstrap
וועגווייַזער און לויפןnpm install
צו ינסטאַלירן אונדזער היגע דיפּענדאַנסיז ליסטעד אין package.json .
ווען עס איז געענדיקט, איר קענען לויפן די פאַרשידן קאַמאַנדז צוגעשטעלט פֿון די באַפֿעלן שורה.
ניצן npm סקריפּס
אונדזער package.json כולל די פאלגענדע קאַמאַנדז און טאַסקס:
אַרבעט | באַשרייַבונג |
---|---|
npm run dist |
npm run dist קריייץ די /dist/ וועגווייַזער מיט קאַמפּיילד טעקעס. ניצט Sass , Autoprefixer און Terser . |
npm test |
לויפט טעסץ לאָוקאַלי נאָך פליסנדיקnpm run dist |
npm run docs-serve |
בויען און לויפט די דאַקיומענטיישאַן לאָוקאַלי. |
לויפן npm run
צו זען אַלע npm סקריפּס.
סאַס
Bootstrap v4 ניצט Node Sass פֿאַר קאַמפּיילינג אונדזער סאַסס מקור טעקעס אין CSS טעקעס (אַרייַנגערעכנט אין אונדזער בויען פּראָצעס). אין סדר צו ענדיקן די זעלבע דזשענערייטאַד CSS ווען קאַמפּיילינג Sass ניצן דיין אייגענע אַסעט רערנ - ליניע, איר דאַרפֿן צו נוצן אַ Sass קאַמפּיילער וואָס שטיצט לפּחות די פֿעיִקייטן וואָס Node Sass טוט. דאָס איז וויכטיק צו טאָן ווייַל פון 26 אקטאבער 2020, LibSass און פּאַקאַדזשאַז געבויט אויף שפּיץ פון עס - אַרייַנגערעכנט Node Sass - זענען דיפּרישיייטיד .
אויב איר דאַרפן נייַער סאַס פֿעיִקייטן אָדער קאַמפּאַטאַבילאַטי מיט נייַער קסס סטאַנדאַרדס, Dart Sass איז איצט די ערשטיק ימפּלאַמענטיישאַן פון Sass און שטיצט אַ דזשאַוואַסקריפּט אַפּי וואָס איז גאָר קאַמפּאַטאַבאַל מיט Node Sass (מיט עטלעכע אויסנעמען ליסטעד אויף Dart Sass GitHub בלאַט ).
מיר פאַרגרעסערן די סאַס ראַונדינג פּינטלעכקייַט צו 6 (דורך פעליקייַט, עס איז 5 אין נאָדע סאַס) צו פאַרמייַדן ישוז מיט בלעטערער ראַונדינג. אויב איר נוצן Dart Sass, דאָס וועט נישט זיין עפּעס וואָס איר דאַרפֿן צו סטרויערן, ווייַל דער קאַמפּיילער ניצט אַ ראַונדינג פּינטלעכקייַט פון 10 און פֿאַר עפעקטיווקייַט סיבות קען נישט זיין אַדזשאַסטיד.
אַוטאָפּרעפיקסער
Bootstrap ניצט Autoprefixer (אַרייַנגערעכנט אין אונדזער בויען פּראָצעס) צו אויטאָמאַטיש לייגן פאַרקויפער פּרעפיקסיז צו עטלעכע CSS פּראָפּערטיעס אין די בויען צייט. טאן אַזוי סאַוועס אונדז צייט און קאָד דורך אַלאַוינג אונדז צו שרייַבן שליסל פּאַרץ פון אונדזער CSS אַ איין מאָל און ילימאַנייטינג די נויט פֿאַר פאַרקויפער מיקסינס ווי די געפֿונען אין וו3.
מיר האַלטן די רשימה פון בראַוזערז געשטיצט דורך Autoprefixer אין אַ באַזונדער טעקע אין אונדזער GitHub ריפּאַזאַטאָרי. זען .browserslistrc פֿאַר פרטים.
לאקאלע דאקומענטאציע
לויפן אונדזער דאַקיומענטיישאַן לאָוקאַלי ריקווייערז די נוצן פון Hugo, וואָס איז אינסטאַלירן דורך די Hugo-bin npm פּעקל. הוגאָ איז אַ בלייזינגלי שנעל און גאַנץ עקסטענסיבלע סטאַטיק פּלאַץ גענעראַטאָר וואָס גיט אונדז: יקערדיק ינקלודז, מאַרקדאָוון-באזירט טעקעס, טעמפּלאַטעס, און מער. דאָ ס ווי צו באַקומען עס סטאַרטעד:
- לויפן דורך די מכשירים סעטאַפּ אויבן צו ינסטאַלירן אַלע דיפּענדאַנסיז.
- פֿון דער וואָרצל
/bootstrap
וועגווייַזער, לויפןnpm run docs-serve
אין די באַפֿעלן שורה. - עפֿענען
http://localhost:9001/
אין דיין בלעטערער, און voilà.
לערנען מער וועגן ניצן Hugo דורך לייענען זיין דאַקיומענטיישאַן .
טראָובלעשאָאָטינג
אויב איר טרעפן פּראָבלעמס מיט ינסטאָלינג דיפּענדאַנסיז, נעם אַוועק אַלע פרייַערדיק דעפּענדענסי ווערסיעס (גלאבאלע און היגע). דערנאָך, ריסטאַרט npm install
.