نصب و استفاده از npm

NPM چیست؟

NPM مخفف Node Package Manager است. یک پکیج منیجر یا مدیریت پکیجی است که برای NodeJs نوشته شده است. (npm قسمتی از پلتفرم NodeJs است) البته این به معنای آن نیست که حتما باید در پروژه هایی که با NodeJs نوشته می شوند از NPM استفاده کرد بلکه در خیلی از موارد دیگر هم می شود از آن استفاده کرد. اجرای دستورات NPM از طریق خط فرمان (Command line) صورت می گیرد. دانستن ان پی ام به تنهایی کاربردی ندارد اما پیش نیاز خیلی از تکنولوژی های دیگر وب است.

منظور از مدیریت پکیج

منظور از پکیج هر چیزی است که به زبان جاوا اسکریپت نوشته شده است (شاید هم به زبان های دیگر در پلت فرم های دیگر). پکیج همان ماژول، کتابخانه یا فریم ورک است. به عنوان نمونه Jquery و Bootstrap پکیج یا ماژول هایی هستند که می توان از طریق npm آن ها را نصب کرد. برای مثال فرض کنید که در پروژه ای که می خواهید انجام بدین از bootstrap استفاده می کنید. با استفاده از npm پکیج bootstrap را دانلود می کنید و در پروژه خودتون استفاده می کنید.

 

از ان پی ام برای نصب پکیج های مختلف در پروژه های وب استفاده می شود

 

برخی از مزایای استفاده از NPM

  • مشخص شدن ماژول های مورد استفاده در پروژه
  • نسخه بندی پروژه
  • ثبت اطلاعات کلی پروژه مانند نام پروژه
  • آپلود پروژه در گیت هاب
  • تعیین دقیق نخسه ماژول ها
  • آپدیت و به روز رسانی ماژول ها

 

نصب و استفاده از Node Package Manager

برای نصب NPM باید NodeJs را دانلود و نصب کنید. نصب نود جی اس مانند دیگر برنامه ها انجام می شود. برای دانلود آن به سایت nodejs.org بروید.
بعد از نصب nodejs جهت اطمینان از درستی نصب به Command Line بروید و دستور node -v را تایپ و اینتر بزنید. این دستور نسخه nodejs نصب شده را نشان می دهد. همچنین دستور npm -v نسخه npm را نشان می دهد.
دستور node -v را می توان به شکل node –version و همچنین دستور npm -v را می توان به شکل npm –version هم استفاده کرد. هر دو یک کار را انجام می دهند.
nodejs

برای دسترسی به command line در ویندوز کلید windows + r را بزنید و در پنجره Run کلمه cmd را تایپ کنید.

 

نصب Git

برای اجرا دستورات NPM به Git نیازی نیست. تمامی دستورات را می توان در command line اجرا کرد. اما پیشنهاد می شود گیت را نصب کنید و از گیت برای اجرا دستورات استفاده کنید. کار کردن در محیط گیت راحت تر از command line است. همچنین اگر از ویندوز یا از مک استفاده کنید دستورات مشابه هم هستند. این در صورتی است که دستورات در محیط Terminal در مک متفاوت از command line در ویندوز است. برای نصب گیت به سایت git-scm.com بروید

شروع به کار با NPM

تا الان NodeJs و Git در سیستم نصب شده اند و همه چیز برای شروع کار آماده است. ماژول هایی که از طریق npm نصب می شوند به دو طریق قابل استفاده اند. یا می توانید یک ماژول یا پکیج را به صورت Global نصب کنید و یا به صورت Local. تفاوت این دو دراین است که اگر به صورت global نصب کنید می توان از پکیج نصب شده در تمام پروژه ها استفاده کرد اما اگر به صورت local نصب شود فقط برای پروژه مورد نظر قابل استفاده خواهد بود.

برای مثال می خواهیم bootstrap را فقط برای پروژه مورد نظر نصب کنیم. نخست وارد پوشه پروژه خودتون شوید سپس راست کلیک کنید و از منوی باز شده گزینه ی Git Bash Here را کلیک کنید. این کار باعث می شود که مسیر گیت در داخل پوشه ی مورد نظرتون باشه. در پنجره گیت دستور npm install boostrap را تایپ کنید و اینتر بزنید. پس از کمی مکث بوتسترپ نصب می شود. اگر به پوشه خود دقت کنید یک پوشه جدید با نام node_modules ایجاد شده که در داخل آن پکیج bootstrap به طور کامل دانلود شده و داخل پوشه قرار گرفته. همچین یک فایل با نام package.json در پوشه مورد نظر ساخته شده است. اگر می خواستید bootstrap را به صورت global نصب کنید باید از سوئیچ g- استفاده کنید. دستور زیر: npm install -g boostrap

 

پیدا کردن پکیج ها در سایت npmjs.com

وارد سایت npmjs.com که می شوید در قسمت بالای سایت نوار جستجو قرار دارد. با جستجوی پکیج مورد نظر درنوار جستجو می توانید به راحتی
پکیج خود را پیدا کنید و دستور نصب آن را هم بخوانید. همچنین در این سایت اطلاعات مفید دیگری مانند تعداد دانلود آن پکیج در طول یک هفته، ورژن، لایسنس و دیگر موارد را به راحتی به دست میارید.
npm

بررسی فایل package.json

فایل package.json یک فایل متنی است که اطلاعات پایه ای پروژه را نگهداری می کند. در این فایل وابستگی ها (dependencies)، نام و نسخه برنامه را تعیین می کنیم. در واقع nodeJs از طریق این فایل ماژول های پروژه شما را مدیریت می کند.

کارهایی که فایل package.json انجام می دهد:

  • نگهداری اطلاعات پروژه
  • بارگذاری ماژول ها
  • ساختن یا ساختن مجدد ماژول ها
  • اطلاعات وابستگی های (dependencies) پروژه

 

روش ساخت package.json به صورت دستی

وارد پوشه پروژه خود شوید و یک فایل جدید با نام package.json ایجاد کنید. این فایل حداقل باید دارای دو پارامتر باشد: ۱- نام (معمولا نام پروژه) ۲- ورژن یا نسخه
نام: قسمت نام باید قوانین نامگذاری را رعایت کند: نام باید از حروف کوچک تشکیل شده باشد. در نام فایل اسپس یا همان فضای خالی نباشد. با نقطه و یا underline شروع نشود.
نسخه یا ورژن: نسخه اپلیکیش را مشخص می کنیم.
dependencies: یا وابستگی های اپلیکیشن. در این قسمت مشخص می کنیم که پروژه ما از چه ماژول هایی استفاده می کند. مثلا Jquery همچنین ورژن ماژول ها را تعیین می کنیم.

 

علامت ^ در ابتدای ورژن ماژول ها در قسمت dependencies نشان دهنده درخواست آخرین ورژن از

اپلیکیشن مورد نظر است. آخرین ورژن قابل اعتماد (lastest stable version)

  
      {
        "name": "test",
        "version": "0.1.0",
        "description": "this is for test",
        "author": "saeed panahi",
        "license": "MIT",
        "dependencies": {
          "bootstrap": "^4.1.3"
        }
      }
  

اجرای فایل package.json

در فایلی که قبلا ایجاد کردیم dependenciesهای (وابستگی ها) پروژه را مشخص کردیم. حالا با اجرای این فایل dependenciesها نصب می شود. برای اجرا دستور npm install را اجرا می کنیم.

 

روش ساخت package.json به شکل اتوماتیک

وارد پوشه پروژه شوید
خط فرمان (command-line) یا git bash را اجرا کنید
دستور npm init را تایپ کنید و اینتر بزنید
مراحل را دنبال کنید. مانند نام پروژه و …
اگر چیزی در مقابل اطلاعات درخواستی تایپ نکنید و اینتر بزنید یعنی مقدار پیش فرض را پذیرفته اید. (نگران اطلاعات وارد می کنید نباشید، چون اگر بخواهید چیزی را تغییر دهید بعدا می تونید این کار را انجام دهید)

گیت
 

ویرایش فایل package.json

به دو روش می توان فایل package.json را ویرایش کرد:
۱ – فایل را توسط یک برنامه ویرایشگر متن باز کنید و ویرایش کنید
۲ – توسط خط فرمان. توسط خط فرمان (که البته در اینجا ما از git bash استفاده می کنیم) راحت تر و مطمئن تر است.

 

دستورات

مثال: فرض کنید در فایل package.json پکیج bootstrap به عنوان dependencies تعریف شده است. حالا برای اینکه bootstrap نصب شود دستور npm install –save bootstrap را اجرا کنید. این دستور پکیج bootstrap را به طور کامل نصب می کند. اگر در قسمت dependencies پکیجی مشخص نشده باشد توسط این دستور اضافه می شود.

npm list: پکیج های نصب شده را نشان می دهد.
nmp -g list: لیست تمام پکیج های نصب شده به صورت سراسری (global) در سیستم را نشان می دهد
npm outdated: لیست پکیج هایی را نشان می دهد که ورژن آنها قدیمی شده است
npm update: پکیج های نصب شده را در صورت استفاده از ^ آپدیت می کند
npm uninstall: پکیج نصب شده ای را حذف می کند. مثال: npm uninstall bootstrap
npm prune: فولدرهایی (پکیج ها) در پروژه هستند اما در فایل package.json تعریف نشده اند را حذف می کند.

 
 

نویسنده: سعید پناهی

طراح و توسعه دهنده وب، رابط کاربری. فرانت اند. علاقه مند به یادگیری و آموزش

یک پاسخ به “نصب و استفاده از NPM”

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

احتمالا از اینها هم خوشتون بیاد

بررسی واحدهای REM -EM – VH- VW و تفاوت بین آنها

برای مدت های طولانی طراحان و توسعه دهندگان وب سایت ها برای اندازه گذاری فونت، حاشیه و یا هر عنصر دیگری از واحد px که نشان دهنده پیکسل بود استفاده می کردند. اما امروزه با توجه به گسترش استفاده از دستگاه های مختلف مانند موبایل و تبلت برای نمایش وب سایت ها لزوم استفاده از واحدهایی که کنترل بیشتری به توسعه دهنده و طراح بدهد بیشتر شد. از این رو واحدهای rem و em تقریبا جای واحد px را گرفت.

css-custom-property

تعریف و استفاده از متغیرها در CSS

مانند سایر زبان های برنامه نویسی که از متغیر ها برای نگهداری مقداری استفاده می شود که بتوان بعدا در هر زمان به آن مراجعه کرد، در سی اس اس هم برای نگهداری و یا ذخیره سازی مواردی مانند رنگ ها، نام فونت، اندازه فونت و … استفاده می شود و می توان در جاهای مختلف فایل سی اس اس آن را صدا کرد و از مقدار آن استفاده کرد. اسم رسمی و صحیح این متغیرها custom properties می باشد که معمولا در بین توسعه دهندگان و برنامه نویسان به نام متغیر جا افتاده است.

چرا و چگونه باید از Microdata در HTML5 استفاده کنیم

توسط microdata دقیقا مشخص می کنیم که محتوای سایتمان چی هست. موتورهای جستجو دقیقا متوجه می شوند که سایت ما چه اطلاعاتی دارد. آیا کتاب معرفی کرده یا فیلم یا هر چیزی دیگری که باشد برای ماشین ها و موتورهای جستجو کاملا قابل فهم می شود. توسط مایکرودیتا (microdata) دقیقا نوع محتوا را مشخص می کنیم نه فقط شکل و شمایل نمایش آن را.