ናብ ቀንዲ ትሕዝቶ ዘልል ናብ docs navigation ዘልል
Check
in English

ኣዋፅእ

ብናይ ሰነዳትና ህንጸት ስክሪፕትን ፈተነታትን Bootstrap ንምምዕባል ሓግዝ።

ኣብዚ ገጽ

ምድላው መሳርሒታት

ቡትስትራፕ ነቲ ሰነድ ንምህናጽን ምንጪ ፋይላት ንምጥርናፍን npm ስክሪፕት ይጥቀም። package.json ናትና ነዞም ስክሪፕትታት ንኮድ ንምጥርናፍ፣ ፈተነታት ንምክያድን ካልእን ዝሕዝ እዩ። እዚኦም ካብ መኽዘንናን ሰነዳትናን ወጻኢ ንኽትጥቀመሎም ዝተሓሰቡ ኣይኮኑን።

ናትና build system ንምጥቃምን ሰነዳትና ኣብ ውሽጢ ዓዲ ንምስራሕን፡ ቅዳሕ ናይ Bootstrap ምንጪ ፋይላትን Nodeን ከድልየኩም እዩ። ነዞም ዝስዕቡ ስጉምትታት ተኸተል እሞ ንኽትናወጽ ድሉው ክትከውን ኣለካ፤

  1. ጽግዕተኛታትና ንምምሕዳር እንጥቀመሉ Node.js ኣውሪድና ንጽዓኖ ።
  2. ወይ ምንጪታት ቡትስትራፕ ኣውርድ ወይ ድማ መኽዘን ቡትስትራፕ ፎርክ ግበር ።
  3. ናብቲ ሱር /bootstrapማህደር ብምኻድ ኣብ package.jsonnpm install ዝተዘርዘሩ ናይ ከባቢና ጽግዕተኛታትና ንምትካል ንጉየ ።

ምስ ተዛዘመ፡ ካብ መስመር ትእዛዝ ዝቐረቡ ዝተፈላለዩ ትእዛዛት ከተካይድ ትኽእል ኢኻ።

npm ስክሪፕት ምጥቃም

package.json ናትና ነቲ ፕሮጀክት ንምምዕባል ዝሕግዙ ብዙሓት ዕማማት ዘጠቓልል እዩ። npm runኣብ ተርሚናልካ ዘለዉ ኩሎም npm ስክሪፕትታት ንምርኣይ ጐየዩ ። ቀዳሞት ዕማማት ድማ፤

ዕዮ መግለፂ
npm start ሲኤስኤስን ጃቫስክሪፕትን ኣጠቓሊሉ፡ ነቲ ሰነድ ይሃንጽ፡ ከምኡውን ሎካል ሰርቨር ይጅምር።
npm run dist dist/ነቲ ማህደር ምስ ዝተጠርነፉ ፋይላት ይፈጥር ። Sass , Autoprefixer , ከምኡውን terser ይጥቀም ።
npm test ድሕሪ ምጉያይ ኣብ ከባቢኡ ፈተነታት የካይድnpm run dist
npm run docs-serve ነቲ ሰነድ ኣብ ከባቢኡ ይሃንጾን የካይዶን።
ብ Bootstrap ብመንገዲ npm ምስ ጀማሪ ፕሮጀክትና ጀምር! ኣብ ናይ ገዛእ ርእስኻ npm ፕሮጀክት ከመይ ጌርካ Bootstrap ትሃንጽን ትመዓራረን ንምርኣይ ናብ twbs/bootstrap-npm-starter template repository ኣቕንዕ። Sass compiler, Autoprefixer, Stylelint, PurgeCSS, ከምኡውን Bootstrap Icons ዘጠቓልል እዩ።

ሳስ

ቡትስትራፕ ንናይ ሳስ ምንጪ ፋይላትና ናብ CSS ፋይላት (ኣብ መስርሕ ህንጸትና ዝተሓወሱ) ንምጥርናፍ Dart Sass ይጥቀም ፣ ናይ ገዛእ ርእስኻ ንብረት ሻምብቆ ተጠቒምካ ንሳስ ትጥርንፍ እንተኾንካ ድማ ከምኡ ክትገብር ንመክር። ቅድሚ ሕጂ ን Bootstrap v4 Node Sass ንጥቀም ኔርና ኢና፡ LibSassን ኣብ ልዕሊኡ ዝተሃንጹ ፓኬጃትን ግን Node Sass ሓዊስካ፡ ሕጂ ካብ ስራሕ ወጻኢ ኮይኖም ኣለዉ ።

ዳርት ሳስ 10 ዝኾነ ናይ ምኽባብ ትኽክለኛነት ይጥቀምን ብብቕዓት ምኽንያት ድማ ምትዕርራይ ናይዚ ዋጋ ኣይፈቅድን እዩ። ነዚ ትኽክለኛነት ኣብ እዋን ተወሳኺ መስርሕ ናይቲ ዝፈጠሮ CSS ኣይነጉድሎን ኢና፣ ከም ኣብ እዋን ምጉዳል፣ እንተኾነ ግን ከምኡ ክትገብሩ እንተመሪጽኩም ኣብ ምኽባብ መርበብ ሓበሬታ ንዘጋጥሙ ጸገማት ንምክልኻል እንተወሓደ 6 ትኽክለኛነት ክትሕሉ ንመክር።

ኣውቶፕሪፊክሰር

ቡትስትራፕ ኣብ ግዜ ህንጸት ኣብ ገለ CSS ባህርያት ብኣውቶማቲክ ቅድመ-ጥብቆታት ሸየጥቲ ንምውሳኽ Autoprefixer (ኣብ መስርሕ ህንጸትና ዝተሓወሶ) ይጥቀም። ከምኡ ምግባርና ከምቶም ኣብ v3 ዝርከቡ ናይ ሸየጥቲ ሚክሲናት ኣድላይነት እናኣወገድና ቁልፊ ክፋላት ናይ CSSና ኣብ ሓደ ግዜ ክንጽሕፍ ብምፍቃድ ግዜን ኮድን ይቑጥበልና።

ዝርዝር ናይቶም ብመንገዲ Autoprefixer ዝድገፉ መርበባት ሓበሬታ ኣብ ውሽጢ መኽዘን GitHubና ኣብ ፍሉይ ፋይል ንሕዞ። ንዝርዝር ሓበሬታ .browserslistrc ርአ ።

RTLCSS ዝበሃል ትካል እዩ።

ቡትስትራፕ ንዝተጠርነፉ CSS ንምስራሕን ናብ RTL ንምቕያርን RTLCSSpadding-left ይጥቀም – ብመሰረቱ ንኣግማድ ኣንፈት ዝፈልጡ ባህርያት (ንኣብነት ) ብኣንጻሩ ይትክእ። CSSና ኣብ ሓደ ግዜ ጥራይ ክንጽሕፍን RTLCSS control and value directives ተጠቒምና ንኣሽቱ tweaks ክንገብርን የኽእለና ።

ናይ ከባቢ ሰነዳት።

ሰነዳትና ኣብ ውሽጢ ዓዲ ንምስራሕ ሁጎ ምጥቃም የድሊ፣ እዚ ድማ ብመንገዲ hugo-bin npm package ይተክል። ሁጎ ንዓና ዝህበና blazingly ቅልጡፍን ምሉእ ብምሉእ ዝዝርጋሕን ስታትቲክ ሳይት ጀነሬተር እዩ: መሰረታዊ ዘጠቓልል, Markdown-based files, templates, and more. ከመይ ጌርካ ከም እትጅምሮ ኣብዚ ኣሎ፤

  1. ኩሎም ጽግዕተኛታት ንምትካል በቲ ኣብ ላዕሊ ዘሎ ናይ መሳርሒታት ኣወዳድባ ምዝዋር ።
  2. ካብቲ ሱር /bootstrapማህደር npm run docs-serveኣብ መስመር ትእዛዝ ንስራሕ።
  3. http://localhost:9001/ኣብ መርበብ ሓበሬታኻ ክፈት ፡ voilà ድማ።

ብዛዕባ ኣጠቓቕማ ሁጎ ዝያዳ ፍለጡ ሰነዳቱ ብምንባብ ።

ምፍታሕ ጸገማት

ኣብ ምትካል ጽግዕተኛታት ጸገማት እንተ ኣጋጢሙካ፡ ንኹሎም ዝሓለፉ ጽግዕተኛታት ስሪት (ዓለማውን ከባብያውን) ኣውጽእዎ። ድሕሪኡ፡ ዳግማይ ምዝዋር npm install.