Tīpoka ki te ihirangi matua Tīpoka ki te whakaterenga tuhinga
in English

Te takoha

Awhina ki te whakawhanake i a Bootstrap me a maatau tuhinga ki te hanga tuhinga me nga whakamatautau.

Tatūnga taputapu

Ka whakamahi a Bootstrap i nga tuhinga npm hei hanga i nga tuhinga me te whakahiato i nga konae puna. Kei roto i ta maatau package.json enei tuhinga tuhi mo te whakahiato waehere, whakahaere whakamatautau, me etahi atu. Ehara enei i te tikanga mo te whakamahi i waho o to maatau putunga me nga tuhinga.

Hei whakamahi i ta maatau punaha hanga me te whakahaere i a maatau tuhinga i te rohe, ka hiahia koe ki te kape o nga konae puna a Bootstrap me te Node. A pee i enei mahi ka rite koe ki te toka:

  1. Tikiake me te whakauru i te Node.js , ka whakamahia e matou hei whakahaere i o maatau whakawhirinaki.
  2. Tangohia nga puna a Bootstrap , marau ranei te putunga a Bootstrap .
  3. /bootstrapWhakatere ki te whaiaronga pakiaka ka oma npm installki te whakauru i o maatau whakawhirinakitanga rohe kua whakarārangihia ki package.json .

Ina oti, ka taea e koe te whakahaere i nga momo whakahau e whakaratohia ana mai i te rarangi whakahau.

Te whakamahi i nga tuhinga npm

Kei roto i ta maatau package.json nga mahi maha mo te whakawhanake i te kaupapa. Rere npm runki te kite i nga tuhinga npm katoa i to tauranga. Ko nga mahi tuatahi ko:

Mahi Whakaahuatanga
npm start Ka whakahiato i te CSS me te JavaScript, ka hanga i nga tuhinga, ka timata i te tūmau rohe.
npm run dist Ka waihanga i te dist/whaiaronga me nga konae kua whakahiato. E hiahia ana ki a Sass , Autoprefixer me te terser .
npm test Ka whakahaerehia nga whakamatautau i te rohe i muri i te omanpm run dist
npm run docs-serve Ka hanga, ka whakahaere i nga tuhinga i te rohe.
Me timata me Bootstrap ma te npm me ta maatau kaupapa timata! Haere ki te whare taonga tauira twbs/bootstrap-npm-starter kia kite me pehea te hanga me te whakarite i a Bootstrap i roto i to ake kaupapa npm. Kei roto ko Sass compiler, Autoprefixer, Stylelint, PurgeCSS, me Bootstrap Ata.

Sass

Ka whakamahi a Bootstrap i a Dart Sass mo te whakahiato i a maatau konae puna Sass ki roto i nga konae CSS (kei roto i a maatau mahi hanga), ka tūtohu kia pera ano koe mena kei te whakahiato koe i a Sass ma te whakamahi i to ake paipa rawa. I whakamahia e matou i mua i te Node Sass mo Bootstrap v4, engari ko LibSass me nga kohinga i hangaia ki runga ake, tae atu ki a Node Sass, kua whakakorea inaianei .

Ka whakamahi a Dart Sass i te tika whakaawhiwhi o te 10 a mo nga take whai hua kaore e whakaaetia te whakarereketanga o tenei uara. E kore matou e whakaheke i tenei tika i te wa e tukatuka ana i a maatau CSS i hangaia, penei i te wa whakaiti, engari ki te hiahia koe ki te mahi pera ka tūtohu kia mau ki te 6 iti rawa hei aukati i nga raru o te hurihanga tirotiro.

WhakapaiAunoa

Ka whakamahi a Bootstrap i te Autoprefixer (kei roto i a maatau mahi hanga) hei taapiri aunoa i nga tohu tohu kaihoko ki etahi taonga CSS i te wa hanga. Ma te mahi pera ka whakaora tatou i te wa me te waehere ma te tuku i a maatau ki te tuhi i nga waahanga matua o a maatau CSS mo te wa kotahi i te wa e whakakorehia ana te hiahia mo nga whakaranu kaihoko penei i era i kitea i roto i te v3.

Ka pupuri tonu matou i te rarangi o nga kaitirotiro e tautokohia ana e Autoprefixer i roto i tetahi konae motuhake i roto i ta maatau putunga putunga GitHub. Tirohia te .browserslistrc mo nga taipitopito.

RTLCSS

Ka whakamahi a Bootstrap i te RTLCSS ki te tukatuka i te CSS whakahiato me te huri ki te RTL - me te whakakapi i nga ahuatanga mohio ki te ahunga whakapae (hei tauira. padding-left) me te rereke. Ka taea e maatau anake te tuhi i a maatau CSS mo te wa kotahi me te hanga i nga tweaks iti ma te whakamahi i te mana RTLCSS me nga tohutohu uara .

Nga tuhinga a rohe

Ko te whakahaere i a maatau tuhinga a rohe me whakamahi a Hugo, ka whakauruhia ma te putea hugo-bin npm. Ko Hugo he kaiwhakawhanake pae pateko tino tere me te whanui e whakarato ana ki a matou: ko nga mea taketake, ko nga konae a Markdown, nga tauira, me etahi atu. Anei me pehea te tiimata:

  1. Whakahaerehia te tatūnga taputapu i runga ake nei hei whakauru i nga whakawhirinakitanga katoa.
  2. /bootstrapMai i te whaiaronga pakiaka , rere npm run docs-servei roto i te raina whakahau.
  3. Tuwhera http://localhost:9001/i roto i to kaitirotiro, a voilà.

Ako atu mo te whakamahi Hugo ma te panui i ana tuhinga .

Raparongoā

Mena ka raru koe ki te whakauru i nga whakawhirinakitanga, wetewete i nga putanga whakawhirinakitanga o mua (ao me te rohe). Na, rere ano npm install.