مرکزی مواد پر جائیں۔ ڈاکس نیویگیشن پر جائیں۔
in English

اوزار بنائیں

ہمارے دستاویزات بنانے، سورس کوڈ کو مرتب کرنے، ٹیسٹ چلانے اور مزید بہت کچھ کرنے کے لیے بوٹسٹریپ کے شامل کردہ npm اسکرپٹس کو استعمال کرنے کا طریقہ سیکھیں۔

اس صفحہ پر

ٹولنگ سیٹ اپ

بوٹسٹریپ اپنے بلڈ سسٹم کے لیے این پی ایم اسکرپٹس کا استعمال کرتا ہے۔ ہمارے package.json میں فریم ورک کے ساتھ کام کرنے کے لیے آسان طریقے شامل ہیں، بشمول کوڈ مرتب کرنا، ٹیسٹ چلانا، اور بہت کچھ۔

ہمارے بلڈ سسٹم کو استعمال کرنے اور ہماری دستاویزات کو مقامی طور پر چلانے کے لیے، آپ کو بوٹسٹریپ کی سورس فائلز اور نوڈ کی ایک کاپی درکار ہوگی۔ ان اقدامات پر عمل کریں اور آپ کو ہلانے کے لیے تیار ہونا چاہیے:

  1. ڈاؤن لوڈ اور انسٹال کریں Node.js ، جسے ہم اپنے انحصار کو منظم کرنے کے لیے استعمال کرتے ہیں۔
  2. یا تو بوٹسٹریپ کے ذرائع کو ڈاؤن لوڈ کریں یا بوٹسٹریپ کے ذخیرے کو فورک کریں۔
  3. روٹ /bootstrapڈائرکٹری پر جائیں اور پیکج. jsonnpm install میں درج ہماری مقامی انحصار کو انسٹال کرنے کے لیے چلائیں ۔

مکمل ہونے پر، آپ کمانڈ لائن سے فراہم کردہ مختلف کمانڈز کو چلانے کے قابل ہو جائیں گے۔

این پی ایم اسکرپٹس کا استعمال

ہمارے package.json میں پروجیکٹ کو تیار کرنے کے لیے متعدد کام شامل ہیں۔ اپنے ٹرمینل میں تمام npm npm runاسکرپٹ دیکھنے کے لیے دوڑیں۔ بنیادی کاموں میں شامل ہیں:

کام تفصیل
npm start CSS اور JavaScript کو مرتب کرتا ہے، دستاویزات بناتا ہے، اور ایک مقامی سرور شروع کرتا ہے۔
npm run dist dist/مرتب شدہ فائلوں کے ساتھ ڈائریکٹری بناتا ہے۔ Sass , Autoprefixer , اور terser کی ضرورت ہے ۔
npm test چلانے کے بعد مقامی طور پر ٹیسٹ چلاتا ہے۔npm run dist
npm run docs-serve مقامی طور پر دستاویزات بناتا اور چلاتا ہے۔
ہمارے اسٹارٹر پروجیکٹ کے ساتھ npm کے ذریعے Bootstrap کے ساتھ شروع کریں! twbs /bootstrap-npm-starter ٹیمپلیٹ ریپوزٹری کی طرف جائیں یہ دیکھنے کے لیے کہ آپ کے اپنے npm پروجیکٹ میں بوٹسٹریپ کو کیسے بنایا جائے اور کس طرح اپنی مرضی کے مطابق بنایا جائے۔ Sass compiler، Autoprefixer، Stylelint، PurgeCSS، اور Bootstrap شبیہیں شامل ہیں۔

سس

بوٹسٹریپ ہماری Sass سورس فائلوں کو CSS فائلوں میں مرتب کرنے کے لیے Dart Sass کا استعمال کرتا ہے (ہمارے تعمیراتی عمل میں شامل ہے)، اور ہم تجویز کرتے ہیں کہ اگر آپ Sass کو اپنی اثاثہ پائپ لائن کا استعمال کرتے ہوئے مرتب کر رہے ہیں تو آپ بھی ایسا ہی کریں۔ ہم نے پہلے Bootstrap v4 کے لیے Node Sass کا استعمال کیا تھا، لیکن LibSass اور اس کے اوپر بنے ہوئے پیکیجز، بشمول Node Sass، اب فرسودہ ہو چکے ہیں ۔

ڈارٹ ساس 10 کی گول درستگی کا استعمال کرتا ہے اور کارکردگی کی وجوہات کی بناء پر اس قدر کو ایڈجسٹ کرنے کی اجازت نہیں دیتا ہے۔ ہم اپنے تیار کردہ CSS کی مزید پروسیسنگ کے دوران اس درستگی کو کم نہیں کرتے ہیں، جیسے کہ minification کے دوران، لیکن اگر آپ نے ایسا کرنے کا انتخاب کیا ہے تو ہم براؤزر راؤنڈنگ کے مسائل کو روکنے کے لیے کم از کم 6 کی درستگی کو برقرار رکھنے کی تجویز کرتے ہیں۔

آٹوپریفکسر

بوٹسٹریپ Autoprefixer (ہمارے تعمیراتی عمل میں شامل ہے) کا استعمال کرتا ہے تاکہ خود بخود وینڈر کے سابقے کو کچھ CSS خصوصیات میں تعمیر کے وقت شامل کیا جا سکے۔ ایسا کرنے سے ہمارے وقت اور کوڈ کی بچت ہوتی ہے اور ہمیں اپنے CSS کے کلیدی حصوں کو ایک بار لکھنے کی اجازت دیتا ہے جبکہ v3 میں پائے جانے والے وینڈر مکسنس کی ضرورت کو ختم کر دیتا ہے۔

ہم اپنے GitHub ریپوزٹری کے اندر ایک علیحدہ فائل میں Autoprefixer کے ذریعے تعاون یافتہ براؤزرز کی فہرست کو برقرار رکھتے ہیں۔ تفصیلات کے لیے .browserslistrc دیکھیں ۔

RTLCSS

بوٹسٹریپ مرتب شدہ سی ایس ایس کو پروسیس کرنے اور انہیں RTL میں تبدیل کرنے کے لیے RTLCSSpadding-left کا استعمال کرتا ہے - بنیادی طور پر افقی سمت سے آگاہ خصوصیات (مثال کے طور پر ) کو ان کے مخالف سے تبدیل کرنا۔ یہ ہمیں صرف ایک بار اپنا CSS لکھنے اور RTLCSS کنٹرول اور ویلیو ڈائریکٹو کا استعمال کرتے ہوئے معمولی تبدیلیاں کرنے کی اجازت دیتا ہے ۔

مقامی دستاویزات

ہماری دستاویزات کو مقامی طور پر چلانے کے لیے ہیوگو کے استعمال کی ضرورت ہوتی ہے، جو ہیوگو بن این پی ایم پیکیج کے ذریعے انسٹال ہوتا ہے ۔ ہیوگو ایک انتہائی تیز اور کافی حد تک قابل توسیع جامد سائٹ جنریٹر ہے جو ہمیں فراہم کرتا ہے: بنیادی شامل ہیں، مارک ڈاؤن پر مبنی فائلیں، ٹیمپلیٹس، اور بہت کچھ۔ اسے شروع کرنے کا طریقہ یہاں ہے:

  1. تمام انحصار کو انسٹال کرنے کے لیے اوپر والے ٹولنگ سیٹ اپ کے ذریعے چلائیں ۔
  2. روٹ /bootstrapڈائرکٹری سے، npm run docs-serveکمانڈ لائن میں چلائیں۔
  3. اپنے براؤزر میں کھولیں http://localhost:9001/، اور voilà۔

ہیوگو کے استعمال کے بارے میں مزید جانیں اس کی دستاویزات پڑھ کر ۔

خرابیوں کا سراغ لگانا

اگر آپ کو انحصار کو انسٹال کرنے میں دشواری کا سامنا کرنا پڑتا ہے تو، تمام پچھلے انحصاری ورژن (عالمی اور مقامی) کو ان انسٹال کریں۔ پھر، دوبارہ چلائیں npm install.