in English

Куруу куралдары

Биздин документацияны түзүү, баштапкы кодду түзүү, тесттерди жүргүзүү жана башкалар үчүн Bootstrap камтылган npm скрипттерин кантип колдонууну үйрөнүңүз.

Курал орнотуу

Bootstrap өзүнүн куруу системасы үчүн npm скрипттерин колдонот. Биздин package.json алкак менен иштөө үчүн ыңгайлуу ыкмаларды камтыйт, анын ичинде кодду түзүү, тесттерди жүргүзүү жана башкалар.

Куруу тутумубузду колдонуу жана документтерибизди жергиликтүү түрдө иштетүү үчүн сизге Bootstrap булак файлдарынын жана Түйүндүн көчүрмөсү керек болот. Бул кадамдарды аткарыңыз жана сиз рок даяр болушуңуз керек:

  1. Биз көз карандылыктарыбызды башкаруу үчүн колдоно турган Node.jsти жүктөп алып орнотуп алыңыз .
  2. Же Bootstrap булактарын жүктөп алыңыз же Bootstrap репозиторийсин айрыңыз .
  3. Түпкү /bootstrapкаталогго чабыттап, package.json npm installичинде тизмеленген жергиликтүү көз карандылыктарыбызды орнотуу үчүн чуркаңыз .

Бүткөндөн кийин, сиз буйрук сабынан берилген ар кандай буйруктарды иштете аласыз.

npm скрипттерин колдонуу

Биздин package.json төмөнкү буйруктарды жана тапшырмаларды камтыйт:

Тапшырма Description
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 шаблон репозиторийине баш багыңыз жана Bootstrapти өзүңүздүн npm долбооруңузда кантип курууну жана ыңгайлаштырууну көрүү. 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's GitHub бетинде тизмеленген бир нече өзгөчөлүктөрдөн тышкары ).

Серепчинин тегеректөөсүнө байланыштуу көйгөйлөрдүн алдын алуу үчүн Sass тегеректөө тактыгын 6га чейин жогорулатабыз (демейки боюнча, Sass түйүнүндө 5). Эгер сиз Dart Sass колдонсоңуз, бул сизге тууралоону талап кылбайт, анткени ал компилятор 10 тегеректөө тактыгын колдонот жана эффективдүү себептерден улам аны тууралоого жол бербейт.

Autoprefixer

Bootstrap куруу учурунда кээ бир CSS касиеттерине сатуучунун префикстерин автоматтык түрдө кошуу үчүн Autoprefixer (биздин куруу процессибизге камтылган) колдонот. Мындай кылуу бизге CSSтин негизги бөлүктөрүн бир жолу жазууга мүмкүндүк берип, убакытты жана кодду үнөмдөйт, ошол эле учурда v3 версиясында табылган сатуучу аралашмаларына болгон муктаждыкты жокко чыгарат.

Autoprefixer аркылуу колдоого алынган браузерлердин тизмесин GitHub репозиторийибиздеги өзүнчө файлда сактайбыз. Чоо-жайын көрүү үчүн .browserlistrc караңыз .

Жергиликтүү документтер

Документтерибизди жергиликтүү түрдө иштетүү үчүн Hugo колдонуу керек, ал hugo-bin npm пакети аркылуу орнотулган. Hugo - бул абдан тез жана кенейтүү статикалык сайт генератору, ал бизге: негизги камтыйт, Markdown негизиндеги файлдар, шаблондор жана башкалар. Муну кантип баштоо керек:

  1. Бардык көз карандылыктарды орнотуу үчүн жогорудагы инструменттердин жөндөөсү аркылуу чуркаңыз .
  2. Түп /bootstrapкаталогунан npm run docs-serveбуйрук сабында иштетиңиз.
  3. http://localhost:9001/Браузериңизде ачыңыз жана voilà.

Анын документтерин окуп Hugo колдонуу жөнүндө көбүрөөк билүү .

Проблемаларды чечүү

Көз карандылыкты орнотууда көйгөйлөргө туш болсоңуз, бардык мурунку көз карандылык версияларын (глобалдык жана жергиликтүү) алып салыңыз. Андан кийин, кайра иштетүү npm install.