in English

قورال ياساش

Bootstrap نىڭ ئۆز ئىچىگە ئالغان npm قوليازمىلىرىنى ئىشلىتىپ ھۆججەتلىرىمىزنى قۇرۇش ، مەنبە كودى تۈزۈش ، سىناقلارنى ئىجرا قىلىش ۋە باشقىلارنى ئىشلىتىشنى ئۆگىنىۋېلىڭ.

قورال تەڭشەش

Bootstrap ئۆزىنىڭ قۇرۇش سىستېمىسى ئۈچۈن npm قوليازمىسىنى ئىشلىتىدۇ. Package.json رامكا بىلەن ئىشلەشنىڭ قۇلايلىق ئۇسۇللىرىنى ئۆز ئىچىگە ئالىدۇ ، بۇلار كود تۈزۈش ، ئىجرا قىلىش سىنىقى ۋە باشقىلار .

قۇرۇش سىستېمىمىزنى ئىشلىتىش ۋە ھۆججەتلىرىمىزنى يەرلىكتە ئىجرا قىلىش ئۈچۈن ، Bootstrap نىڭ ئەسلى ھۆججىتى ۋە Node نىڭ كۆپەيتىلگەن نۇسخىسىغا ئېھتىياجلىق بولىسىز. بۇ باسقۇچلارغا ئەگىشىڭ ، تەۋرىنىشكە تەييارلىق قىلىشىڭىز كېرەك:

  1. بېقىنىشچانلىقىمىزنى باشقۇرۇش ئۈچۈن ئىشلىتىدىغان Node.js نى چۈشۈرۈپ قاچىلاڭ .
  2. Bootstrap نىڭ مەنبەسىنى چۈشۈرۈڭ ياكى Bootstrap نىڭ ئامبىرىنى تاللاڭ .
  3. يىلتىز /bootstrapمۇندەرىجىسىگە يۆتكىلىپ ، pack.jsonnpm install دا كۆرسىتىلگەن يەرلىك تايىنىشچانلىقىمىزنى ئورنىتىڭ .

تاماملانغاندىن كېيىن ، بۇيرۇق قۇرىدا تەمىنلەنگەن ھەر خىل بۇيرۇقلارنى ئىجرا قىلالايسىز.

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 قوليازمىلىرىنى كۆرۈش ئۈچۈن يۈگۈرۈڭ .

باشلاش تۈرىمىز بىلەن npm ئارقىلىق Bootstrap بىلەن باشلاڭ! Twbs / bootstrap-npm-starter قېلىپ ئامبىرىغا بېرىپ ، ئۆزىڭىزنىڭ npm تۈرىدە Bootstrap نى قانداق قۇرۇش ۋە خاسلاشتۇرۇشنى كۆرۈڭ. Sass تۈزگۈچى ، Autoprefixer ، Stylelint ، PurgeCSS ۋە Bootstrap سىنبەلگىسىنى ئۆز ئىچىگە ئالىدۇ.

Sass

Bootstrap v4 بىزنىڭ Sass مەنبە ھۆججىتىمىزنى CSS ھۆججىتىگە قۇرۇش ئۈچۈن Node Sass نى ئىشلىتىدۇ (بىزنىڭ قۇرۇلۇش جەريانىمىزغا كىرىدۇ). ئۆزىڭىزنىڭ مۈلۈك تۇرۇبا يولى ئارقىلىق Sass نى تۈزگەندە ئوخشاش ھاسىل قىلىنغان CSS غا خاتىمە بېرىش ئۈچۈن ، ھېچ بولمىغاندا Node Sass قىلىدىغان ئىقتىدارلارنى قوللايدىغان Sass تۈزگۈچىنى ئىشلىتىشىڭىز كېرەك. دىققەت قىلىشقا تېگىشلىكى شۇكى ، 2020-يىلى 26-ئۆكتەبىردىن باشلاپ ، LibSass ۋە ئۇنىڭ ئۈستىگە ياسالغان ئورالمىلار ، يەنى Node Sass نى ئۆز ئىچىگە ئالىدۇ .

ئەگەر سىز تېخىمۇ يېڭى Sass ئىقتىدارلىرى ياكى يېڭى CSS ئۆلچىمىگە ماسلىشىشنى تەلەپ قىلسىڭىز ، Dart Sass ھازىر Sass نىڭ دەسلەپكى يولغا قويۇلۇشى بولۇپ ، Node Sass بىلەن تولۇق ماس كېلىدىغان JavaScript API نى قوللايدۇ (Dart Sass نىڭ GitHub بېتىدە كۆرسىتىلگەن بىر قانچە ئەھۋال بۇنىڭ سىرتىدا ).

توركۆرگۈ يۇمىلاق ئۈستەل مەسىلىسىنىڭ ئالدىنى ئېلىش ئۈچۈن Sass يۇمىلاق توغرىلىق دەرىجىسىنى 6 گە ئۆستۈرىمىز (سۈكۈتتىكى ھالەتتە ، ئۇ Node Sass دا 5). ئەگەر سىز Dart Sass نى ئىشلەتسىڭىز ، بۇ سىز تەڭشەشكە تېگىشلىك ئىش ئەمەس ، چۈنكى ئۇ تۈزگۈچى 10 يۇمىلاق توغرىلىق ئىشلىتىدۇ ، ئۈنۈم سەۋەبىدىن ئۇنى تەڭشەشكە يول قويمايدۇ.

Autoprefixer

Bootstrap Autoprefixer نى ئىشلىتىدۇ (بىزنىڭ ياساش جەريانىمىزغا كىرىدۇ) قۇرۇلۇش ۋاقتىدا بەزى CSS خۇسۇسىيەتلىرىگە ساتقۇچىلارنىڭ ئالدى قوشۇلغۇچىسىنى ئاپتوماتىك قوشىدۇ. بۇنداق قىلىش بىزگە v3 دىكىگە ئوخشاش ساتقۇچىلار ئارىلاشمىسىنىڭ ئېھتىياجىنى يوقىتىش بىلەن بىر ۋاقىتتا ، CSS نىڭ مۇھىم قىسىملىرىنى بىرلا قېتىم يېزىشىمىزغا يول قويۇپ ، ۋاقىت ۋە كودنى تېجەيدۇ.

Autoprefixer ئارقىلىق قوللايدىغان توركۆرگۈچلەرنىڭ تىزىملىكىنى GitHub ئامبىرىمىز ئىچىدىكى ئايرىم ھۆججەتتە ساقلايمىز. تەپسىلاتىنى .browserslistrc دىن كۆرۈڭ.

يەرلىك ھۆججەتلەر

ھۆججەتلىرىمىزنى يەرلىكتە ئىجرا قىلىش Hugo -bin npm بولىقى ئارقىلىق قاچىلانغان Hugo نى ئىشلىتىشنى تەلەپ قىلىدۇ . Hugo كىشىنى ھەيران قالدۇرىدىغان تېز ۋە بىر قەدەر كېڭەيتكىلى بولىدىغان تۇراقلىق تور بېكەت گېنېراتورى بولۇپ ، ئۇ بىزنى تەمىنلەيدۇ: ئاساسى ، Markdown نى ئاساس قىلغان ھۆججەتلەر ، قېلىپلار ۋە باشقىلار. ئۇنى قانداق باشلاش كېرەك:

  1. بارلىق تايىنىشچانلىقىنى ئورنىتىش ئۈچۈن ئۈستىدىكى قورال تەڭشەش ئارقىلىق ئىجرا قىلىڭ .
  2. يىلتىز /bootstrapمۇندەرىجىسىدىن npm run docs-serveبۇيرۇق قۇرىدا ئىجرا قىلىڭ.
  3. http://localhost:9001/تور كۆرگۈچىڭىزدە ئېچىڭ .

ئۇنىڭ ھۆججەتلىرىنى ئوقۇش ئارقىلىق Hugo نى ئىشلىتىش ھەققىدىكى تەپسىلاتلار .

كاشىلا

بېقىنىش ئورنىتىش مەسىلىسىگە يولۇقسىڭىز ، ئىلگىرىكى بېقىنىش نەشىرىنى (يەرشارى ۋە يەرلىك) ئۆچۈرۈڭ. ئاندىن قايتا قوزغىتىڭ npm install.