Source

ഉപകരണങ്ങൾ നിർമ്മിക്കുക

ഞങ്ങളുടെ ഡോക്യുമെന്റേഷൻ നിർമ്മിക്കുന്നതിനും സോഴ്സ് കോഡ് കംപൈൽ ചെയ്യുന്നതിനും ടെസ്റ്റുകൾ പ്രവർത്തിപ്പിക്കുന്നതിനും മറ്റും ബൂട്ട്സ്ട്രാപ്പിൽ ഉൾപ്പെടുത്തിയിരിക്കുന്ന npm സ്ക്രിപ്റ്റുകൾ എങ്ങനെ ഉപയോഗിക്കാമെന്ന് മനസിലാക്കുക.

ടൂളിംഗ് സജ്ജീകരണം

ബൂട്ട്സ്ട്രാപ്പ് അതിന്റെ ബിൽഡ് സിസ്റ്റത്തിനായി NPM സ്ക്രിപ്റ്റുകൾ ഉപയോഗിക്കുന്നു. കോഡ് കംപൈൽ ചെയ്യൽ, റണ്ണിംഗ് ടെസ്റ്റുകൾ എന്നിവയും അതിലേറെയും ഉൾപ്പെടെ, ചട്ടക്കൂടിനൊപ്പം പ്രവർത്തിക്കുന്നതിനുള്ള സൗകര്യപ്രദമായ രീതികൾ ഞങ്ങളുടെ package.json- ൽ ഉൾപ്പെടുന്നു.

ഞങ്ങളുടെ ബിൽഡ് സിസ്റ്റം ഉപയോഗിക്കുന്നതിനും ഞങ്ങളുടെ ഡോക്യുമെന്റേഷൻ പ്രാദേശികമായി പ്രവർത്തിപ്പിക്കുന്നതിനും, നിങ്ങൾക്ക് ബൂട്ട്സ്ട്രാപ്പിന്റെ ഉറവിട ഫയലുകളുടെയും നോഡിന്റെയും ഒരു പകർപ്പ് ആവശ്യമാണ്. ഈ ഘട്ടങ്ങൾ പാലിക്കുക, നിങ്ങൾ റോക്ക് ചെയ്യാൻ തയ്യാറാകണം:

  1. ഞങ്ങളുടെ ഡിപൻഡൻസികൾ മാനേജ് ചെയ്യാൻ ഉപയോഗിക്കുന്ന Node.js ഡൗൺലോഡ് ചെയ്ത് ഇൻസ്റ്റാൾ ചെയ്യുക.
  2. /bootstrapറൂട്ട് ഡയറക്‌ടറിയിലേക്ക് നാവിഗേറ്റ് ചെയ്‌ത് പാക്കേജ്. json-npm install ൽ ലിസ്‌റ്റ് ചെയ്‌തിരിക്കുന്ന ഞങ്ങളുടെ പ്രാദേശിക ഡിപൻഡൻസികൾ ഇൻസ്റ്റാൾ ചെയ്യാൻ പ്രവർത്തിപ്പിക്കുക .
  3. റൂബി ഇൻസ്റ്റാൾ ചെയ്യുക, ബണ്ടർ ഉപയോഗിച്ച് ഇൻസ്റ്റാൾ ചെയ്യുക gem install bundler, ഒടുവിൽ റൺ ചെയ്യുക bundle install. ജെക്കിൽ, പ്ലഗിനുകൾ തുടങ്ങിയ എല്ലാ റൂബി ഡിപൻഡൻസികളും ഇത് ഇൻസ്റ്റാൾ ചെയ്യും.
    • വിൻഡോസ് ഉപയോക്താക്കൾ: ജെക്കിലിനെ പ്രശ്‌നങ്ങളില്ലാതെ പ്രവർത്തിപ്പിക്കുന്നതിന് ഈ ഗൈഡ് വായിക്കുക .

പൂർത്തിയാകുമ്പോൾ, നിങ്ങൾക്ക് കമാൻഡ് ലൈനിൽ നിന്ന് നൽകിയിരിക്കുന്ന വിവിധ കമാൻഡുകൾ പ്രവർത്തിപ്പിക്കാൻ കഴിയും.

NPM സ്ക്രിപ്റ്റുകൾ ഉപയോഗിക്കുന്നു

ഞങ്ങളുടെ package.json- ൽ ഇനിപ്പറയുന്ന കമാൻഡുകളും ടാസ്‌ക്കുകളും ഉൾപ്പെടുന്നു:

ടാസ്ക് വിവരണം
npm run dist npm run dist/distകംപൈൽ ചെയ്ത ഫയലുകൾ ഉപയോഗിച്ച് ഡയറക്ടറി സൃഷ്ടിക്കുന്നു . Sass , Autoprefixer , UglifyJS എന്നിവ ഉപയോഗിക്കുന്നു .
npm test പ്ലസ് പോലെ തന്നെ npm run distഇത് പ്രാദേശികമായി ടെസ്റ്റുകൾ നടത്തുന്നു
npm run docs ഡോക്‌സിനായി CSS, JavaScript എന്നിവ നിർമ്മിക്കുകയും ലിന്റ് ചെയ്യുകയും ചെയ്യുന്നു. തുടർന്ന് നിങ്ങൾക്ക് പ്രാദേശികമായി ഡോക്യുമെന്റേഷൻ വഴി പ്രവർത്തിപ്പിക്കാൻ കഴിയും npm run docs-serve.

npm runഎല്ലാ npm സ്ക്രിപ്റ്റുകളും കാണാൻ ഓടുക .

ഓട്ടോപ്രിഫിക്സർ

ബിൽഡ് സമയത്ത് ചില CSS പ്രോപ്പർട്ടികളിലേക്ക് വെണ്ടർ പ്രിഫിക്‌സുകൾ സ്വയമേവ ചേർക്കുന്നതിന് ബൂട്ട്‌സ്‌ട്രാപ്പ് Autoprefixer (ഞങ്ങളുടെ ബിൽഡ് പ്രോസസ്സിൽ ഉൾപ്പെടുത്തിയിരിക്കുന്നു) ഉപയോഗിക്കുന്നു. അങ്ങനെ ചെയ്യുന്നത്, v3-ൽ കാണുന്നതുപോലുള്ള വെണ്ടർ മിക്‌സിനുകളുടെ ആവശ്യം ഇല്ലാതാക്കിക്കൊണ്ട് ഞങ്ങളുടെ CSS-ന്റെ പ്രധാന ഭാഗങ്ങൾ ഒറ്റത്തവണ എഴുതാൻ അനുവദിക്കുന്നതിലൂടെ ഞങ്ങളുടെ സമയവും കോഡും ലാഭിക്കുന്നു.

Autoprefixer വഴി പിന്തുണയ്‌ക്കുന്ന ബ്രൗസറുകളുടെ ലിസ്റ്റ് ഞങ്ങളുടെ GitHub ശേഖരണത്തിനുള്ളിൽ ഒരു പ്രത്യേക ഫയലിൽ ഞങ്ങൾ പരിപാലിക്കുന്നു. വിശദാംശങ്ങൾക്ക് /.browserslistrc കാണുക.

പ്രാദേശിക ഡോക്യുമെന്റേഷൻ

ഞങ്ങളുടെ ഡോക്യുമെന്റേഷൻ പ്രാദേശികമായി പ്രവർത്തിപ്പിക്കുന്നതിന്, ഞങ്ങൾക്ക് നൽകുന്ന മാന്യമായി വഴക്കമുള്ള സ്റ്റാറ്റിക് സൈറ്റ് ജനറേറ്ററായ ജെക്കിലിന്റെ ഉപയോഗം ആവശ്യമാണ്: അടിസ്ഥാനപരമായവ, മാർക്ക്ഡൗൺ അടിസ്ഥാനമാക്കിയുള്ള ഫയലുകൾ, ടെംപ്ലേറ്റുകൾ എന്നിവയും അതിലേറെയും ഉൾപ്പെടുന്നു. ഇത് എങ്ങനെ ആരംഭിക്കാമെന്നത് ഇതാ:

  1. ജെക്കിലും (സൈറ്റ് ബിൽഡർ) മറ്റ് റൂബി ഡിപൻഡൻസികളും ഇൻസ്റ്റാൾ ചെയ്യാൻ മുകളിലുള്ള ടൂളിംഗ് സജ്ജീകരണത്തിലൂടെbundle install പ്രവർത്തിപ്പിക്കുക .
  2. റൂട്ട് /bootstrapഡയറക്ടറിയിൽ npm run docs-serveനിന്ന്, കമാൻഡ് ലൈനിൽ പ്രവർത്തിപ്പിക്കുക.
  3. നിങ്ങളുടെ ബ്രൗസറിൽ തുറക്കുക http://localhost:9001, voilà.

അതിന്റെ ഡോക്യുമെന്റേഷൻ വായിച്ചുകൊണ്ട് ജെക്കിൽ ഉപയോഗിക്കുന്നതിനെക്കുറിച്ച് കൂടുതലറിയുക .

ട്രബിൾഷൂട്ടിംഗ്

ഡിപൻഡൻസികൾ ഇൻസ്റ്റാൾ ചെയ്യുന്നതിൽ നിങ്ങൾക്ക് പ്രശ്നങ്ങൾ നേരിടുകയാണെങ്കിൽ, മുമ്പത്തെ എല്ലാ ഡിപൻഡൻസി പതിപ്പുകളും (ആഗോളവും പ്രാദേശികവും) അൺഇൻസ്റ്റാൾ ചെയ്യുക. തുടർന്ന്, വീണ്ടും പ്രവർത്തിപ്പിക്കുക npm install.