ပါဝင်ကူညီပါ။

ကျွန်ုပ်တို့၏စာရွက်စာတမ်းတည်ဆောက်မှု scripts များနှင့်စမ်းသပ်မှုများနှင့်အတူ Bootstrap ဖွံ့ဖြိုးတိုးတက်အောင်ကူညီပါ။

ဤစာမျက်နှာတွင်

Tooling စနစ်ထည့်သွင်းခြင်း။

Bootstrap သည် စာရွက်စာတမ်းများကို တည်ဆောက်ရန်နှင့် အရင်းအမြစ်ဖိုင်များကို စုစည်းရန်အတွက် npm script များကို အသုံးပြုသည်။ ကျွန်ုပ်တို့၏ package.json သည် ကုဒ်ပြုစုခြင်း၊ လုပ်ဆောင်နေသည့် စမ်းသပ်မှုများနှင့် အခြားအရာများအတွက် ဤ script များကို ထားရှိပေးပါသည်။ ၎င်းတို့သည် ကျွန်ုပ်တို့၏ သိုလှောင်မှုနှင့် စာရွက်စာတမ်းများအပြင်ဘက်တွင် အသုံးပြုရန်အတွက် ရည်ရွယ်ခြင်းမဟုတ်ပါ။

ကျွန်ုပ်တို့၏တည်ဆောက်မှုစနစ်ကိုအသုံးပြုပြီး ကျွန်ုပ်တို့၏စာရွက်စာတမ်းများကို စက်တွင်းတွင်လည်ပတ်ရန်အတွက်၊ သင်သည် Bootstrap ၏အရင်းအမြစ်ဖိုင်များနှင့် Node ၏မိတ္တူတစ်ခုလိုအပ်ပါသည်။ ဤအဆင့်များကို လိုက်နာပြီး လှုပ်ရန် အသင့်ဖြစ်သင့်သည်-

ကျွန်ုပ်တို့၏ မှီခိုမှုကိုစီမံခန့်ခွဲရန် ကျွန်ုပ်တို့အသုံးပြုသည့် Node.js ကို ဒေါင်းလုဒ်လုပ်ပြီး ထည့်သွင်း ပါ။
Bootstrap ၏ရင်းမြစ်များကို ဒေါင်းလုဒ်လုပ်၍ ဖြစ်စေ သို့မဟုတ် Bootstrap ၏ သိုလှောင်မှုကို ဖြတ် နိုင်သည်။
root /bootstrapdirectory သို့သွား၍ package.jsonnpm install တွင်ဖော်ပြထားသောကျွန်ုပ်တို့၏ဒေသခံမှီခိုမှုကိုထည့်သွင်းရန် run ပါ ။

ပြီးသွားသောအခါ၊ သင်သည် command line မှပေးသော အမျိုးမျိုးသော command များကို run နိုင်မည်ဖြစ်သည်။

npm script များကိုအသုံးပြုခြင်း။

ကျွန်ုပ်တို့၏ package.json တွင် ပရောဂျက်ကို ဖော်ဆောင်ရန်အတွက် လုပ်ဆောင်စရာများစွာ ပါဝင်သည်။ npm runသင်၏ terminal ရှိ npm script အားလုံးကိုကြည့်ရှုရန် run ။ မူလတာဝန်များ ပါဝင်သည်။

တာဝန်	ဖော်ပြချက်
`npm start`	CSS နှင့် JavaScript ကို စုစည်းပြီး စာရွက်စာတမ်းများကို တည်ဆောက်ကာ ဒေသတွင်း ဆာဗာတစ်ခု စတင်သည်။
`npm run dist`	`dist/`စုစည်းထားသောဖိုင်များဖြင့် လမ်းညွှန်ကို ဖန်တီးပါ ။ Sass ၊ Autoprefixer နှင့် terser ကို အသုံးပြုသည် ။
`npm test`	ပြေးပြီးနောက် စက်တွင်း စမ်းသပ်မှုများကို လုပ်ဆောင်သည်။`npm run dist`
`npm run docs-serve`	စာရွက်စာတမ်းကို စက်တွင်း၌ တည်ဆောက်ပြီး လုပ်ဆောင်သည်။

ကျွန်ုပ်တို့၏ starter ပရောဂျက်ဖြင့် npm မှတစ်ဆင့် Bootstrap ဖြင့် စတင်လိုက်ပါ။ သင့်ကိုယ်ပိုင် npm ပရောဂျက်တွင် Bootstrap တည်ဆောက်ပုံနှင့် စိတ်ကြိုက်ပြင်ဆင်နည်းကို ကြည့်ရှုရန် twbs/bootstrap-npm-starter template သိုလှောင်ရာသို့ သွား ပါ ။ Sass compiler၊ Autoprefixer၊ Stylelint၊ PurgeCSS နှင့် Bootstrap အိုင်ကွန်များ ပါဝင်သည်။

ဆူး

Bootstrap သည် Dart Sass ကိုအသုံးပြုပြီး ကျွန်ုပ်တို့၏ Sass အရင်းအမြစ်ဖိုင်များကို CSS ဖိုင်များ (ကျွန်ုပ်တို့၏တည်ဆောက်မှုလုပ်ငန်းစဉ်တွင်ပါ ၀ င်သည်) သို့စုစည်းပြီး သင့်ကိုယ်ပိုင်ပိုင်ဆိုင်မှုပိုက်လိုင်းကိုအသုံးပြု၍ Sass ကို စုစည်းနေပါက အလားတူလုပ်ဆောင်ရန် အကြံပြုအပ်ပါသည်။ ကျွန်ုပ်တို့သည် ယခင်က Bootstrap v4 အတွက် Node Sass ကို အသုံးပြုခဲ့သော်လည်း Node Sass အပါအဝင် ၎င်းအပေါ်တွင် တည်ဆောက်ထားသော LibSass နှင့် ပက်ကေ့ခ်ျများကို ယခုအခါ ရပ်ဆိုင်းလိုက်ပြီ ဖြစ်သည် ။

Dart Sass သည် 10 အဝိုင်းလိုက်တိကျမှုကို အသုံးပြုပြီး ထိရောက်မှုအကြောင်းများကြောင့် ဤတန်ဖိုးကို ချိန်ညှိခြင်းအား ခွင့်မပြုပါ။ minification လုပ်နေစဉ်ကဲ့သို့သော ကျွန်ုပ်တို့၏ထုတ်လုပ်လိုက်သော CSS ကို ထပ်မံလုပ်ဆောင်ရာတွင် ဤတိကျမှုကို ကျွန်ုပ်တို့ မလျှော့ပါသော်လည်း၊ ထိုသို့ပြုလုပ်ရန် ရွေးချယ်ပါက ဘရောက်ဆာရှာခြင်းဆိုင်ရာ ပြဿနာများကို ကာကွယ်ရန် အနည်းဆုံး 6 တိကျမှုကို ထိန်းသိမ်းထားရန် အကြံပြုအပ်ပါသည်။

အလိုအလျောက် ညွှန်းပေးသည်။

Bootstrap သည် တည်ဆောက်ချိန်၌ အချို့သော CSS ဂုဏ်သတ္တိများသို့ ရောင်းချသူ၏ရှေ့ဆက်များကို အလိုအလျောက်ထည့်သွင်း ရန်အတွက် Autoprefixer (ကျွန်ုပ်တို့၏တည်ဆောက်မှုလုပ်ငန်းစဉ်တွင် ပါဝင်သော) ကိုအသုံးပြုသည်။ ထိုသို့လုပ်ဆောင်ခြင်းဖြင့် v3 တွင်တွေ့ရသော v3 တွင်တွေ့ရသော ရောင်းချသူ mixins လိုအပ်မှုကို ဖယ်ရှားစေပြီး ကျွန်ုပ်တို့၏ CSS ၏ အဓိကအစိတ်အပိုင်းများကို တစ်ကြိမ်တည်းရေးသားခွင့်ပြုခြင်းဖြင့် ကျွန်ုပ်တို့၏အချိန်နှင့် ကုဒ်ကို သက်သာစေပါသည်။

ကျွန်ုပ်တို့သည် ကျွန်ုပ်တို့၏ GitHub သိုလှောင်မှုအတွင်းရှိ သီးခြားဖိုင်တစ်ခုတွင် Autoprefixer မှတစ်ဆင့် ပံ့ပိုးပေးသည့် ဘရောက်ဆာများစာရင်းကို ထိန်းသိမ်းထားသည်။ အသေးစိတ် အတွက် .browserslistrc ကို ကြည့်ပါ ။

RTLCSS

Bootstrap သည် စုစည်းထားသော CSS ကိုလုပ်ဆောင်ရန်နှင့် ၎င်းတို့အား RTL သို့ပြောင်းရန် - အခြေခံအားဖြင့် အလျားလိုက်ဦးတည်ချက်အသိပေးဂုဏ်သတ္တိများ (ဥပမာ padding-left) ၎င်းတို့၏ဆန့်ကျင်ဘက်ဖြင့် အစားထိုးခြင်း။ ၎င်းသည် ကျွန်ုပ်တို့အား ကျွန်ုပ်တို့၏ CSS ကို တစ်ကြိမ်တည်းသာ ရေးသားနိုင်ပြီး RTLCSS ထိန်းချုပ်မှု နှင့် တန်ဖိုး လမ်းညွှန်ချက်များကို အသုံးပြု၍ အသေးစား ပြင်ဆင်မှုများ ပြုလုပ်နိုင်စေပါသည်။

ဒေသဆိုင်ရာစာရွက်စာတမ်း

ကျွန်ုပ်တို့၏စာရွက်စာတမ်းများကို စက်တွင်းတွင်လုပ်ဆောင်ခြင်းသည် hugo-bin npm ပက်ကေ့ခ်ျမှတစ်ဆင့် ထည့်သွင်းထားသည့် Hugo ကိုအသုံးပြုရန်လိုအပ်ပါသည်။ Hugo သည် ကျွန်ုပ်တို့အား ပံ့ပိုးပေးသော အလွန်လျင်မြန်ပြီး တိုးချဲ့နိုင်သော အငြိမ်ဆိုက်ဂျင်နရေတာတစ်ခုဖြစ်သည်- အခြေခံပါဝင်သည်၊ Markdown-based ဖိုင်များ၊ နမူနာများနှင့် အခြားအရာများပါဝင်သည်။ ဤတွင် ၎င်းကို စတင်ရန် နည်းလမ်းမှာ-

မှီခိုမှုအားလုံးကို ထည့်သွင်းရန် အထက်တွင် ကိရိယာတန်ဆာပလာ စနစ် ထည့်သွင်းမှု မှတစ်ဆင့် လုပ်ဆောင်ပါ။
root directory မှ command line တွင် /bootstraprun ပါ။npm run docs-serve
http://localhost:9001/သင်၏ browser တွင် ဖွင့် ပါ၊ နှင့်voilà။

၎င်း၏ စာရွက်စာတမ်းများ ကိုဖတ်ခြင်းဖြင့် Hugo ကိုအသုံးပြုခြင်းအကြောင်းပိုမိုလေ့လာပါ ။

ပြသာနာရှာဖွေရှင်းပေးခြင်း

မှီခိုမှုထည့်သွင်းခြင်းတွင် ပြဿနာများကြုံတွေ့ပါက ယခင်မှီခိုမှုဗားရှင်းများ (ကမ္ဘာလုံးဆိုင်ရာနှင့် ဒေသတွင်း) အားလုံးကို ဖြုတ်လိုက်ပါ။ ပြီးရင် ပြန် run လိုက်ပါ npm install။