အဓိကအကြောင်းအရာသို့ ကျော်သွားပါ။ စာရွက်စာတမ်းလမ်းညွှန်မှုသို့ ကျော်သွားပါ။
in English

ကိရိယာများတည်ဆောက်ပါ။

ကျွန်ုပ်တို့၏စာရွက်စာတမ်းများကိုတည်ဆောက်ရန်၊ အရင်းအမြစ်ကုဒ်စုစည်းမှု၊ စမ်းသပ်မှုများလုပ်ဆောင်ရန်နှင့် အခြားအရာများပြုလုပ်ရန်အတွက် Bootstrap ၏ထည့်သွင်းထားသော npm script များကိုအသုံးပြုနည်းကို လေ့လာပါ။

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

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

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

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

  1. ကျွန်ုပ်တို့၏ မှီခိုမှုကိုစီမံခန့်ခွဲရန် ကျွန်ုပ်တို့အသုံးပြုသည့် Node.js ကို ဒေါင်းလုဒ်လုပ်ပြီး ထည့်သွင်း ပါ။
  2. Bootstrap ၏ရင်းမြစ်များကို ဒေါင်းလုဒ်လုပ်၍ ဖြစ်စေ သို့မဟုတ် Bootstrap ၏ သိုလှောင်မှုကို ဖြတ် နိုင်သည်။
  3. 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 သည် RTLCSS ကို အသုံးပြု၍ စုစည်းထားသော CSS ကို လုပ်ဆောင်ပြီး ၎င်းတို့အား RTL သို့ ပြောင်းပေးသည် - အခြေခံအားဖြင့် အလျားလိုက်ဦးတည်ချက်အသိပေးဂုဏ်သတ္တိများ (ဥပမာ။ padding-left) ကို ၎င်းတို့၏ဆန့်ကျင်ဘက်ဖြင့် အစားထိုးခြင်း။ ၎င်းသည် ကျွန်ုပ်တို့အား ကျွန်ုပ်တို့၏ CSS ကို တစ်ကြိမ်တည်းသာ ရေးသားနိုင်ပြီး RTLCSS ထိန်းချုပ်မှု နှင့် တန်ဖိုး လမ်းညွှန်ချက်များကို အသုံးပြု၍ အသေးစား ပြင်ဆင်မှုများ ပြုလုပ်နိုင်စေပါသည်။

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

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

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

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

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

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