מדריך מקיף ומפורט על npm
סביר להניח שאת המונח npm שמעתם לא מעט, אז מהו npm, מדוע הוא כל כך פופולרי וכיצד משתמשים בו?
npm (ראשי תיבות של node package manager) הוא מנהל הרחבות של node.js.
עבור מי שלא מכיר, node.js מאפשר לנו להריץ JavaScript בצד השרת באמצעות מנוע ה-v8 של גוגל.
ברוב הפרויקטים נשתמש בהרחבות שמשפרות מאוד את תהליכי הפיתוח והביצועים של האפליקציה באופן כללי.
אם אתם מפתחי PHP, סביר להניח שאתם מכירים את Composer, מנהל ההרחבות של PHP.
חשוב לציין שאין חובה לפתח אפליקציות ב-node.js כדי להשתמש ב-npm ובהרחבות המדהימות שבמאגר, אבל אתם כן חייבים להתקין את node.js על הסביבה שלכם מאחר ו-npm הוא חלק מ-node.js.
התקנת node.js
היכנסו לכאן והתקינו את node.js בהתאם לסביבה שלכם.
אני ממליץ להוריד את גרסת ה-LTS.
על מנת לוודא ש-node.js הותקן כראוי, היכנסו לטרמינל שלכם (Git Bash למשל) והזינו את הפקודה הבאה:
node --version
אם קיבלתם את מספר הגרסה הנוכחית, הכל בסדר ואפשר להמשיך.
קובץ ה-package.json
על מנת להתחיל להתקין חבילות, עלינו ליצור את הקובץ הראשי של npm והוא קובץ בשם package,json, ודאי ניחשתם שהוא כתוב בפורמט json המפורסם.
קובץ זה מכיל מידע כללי על הפרויקט שלנו כגון: שם, תיאור, מחבר, רישיון שימוש ומידע חשוב נוסף – תיעוד ההרחבות שהותקנו בפרויקט הנוכחי.
תיעוד זה מחולק לשתי "קטגוריות":
devDependencies – הרחבות שיכנסו לאובייקט זה הן הרחבות שנחוצות לסביבת הפיתוח, כלומר הן משמשמות לפיתוח האפליקציה בלבד.
dependencies – הרחבות שיכנסו לאובייקט זה הן הרחבות שנחוצות לסביבת הפרודשקן, כלומר שהאפליקציה חייבת את ההרחבות הללו על מנת לרוץ בהלכה בפרודקשן.
ארחיב על dependencies ו-devDependencies בהמשך.
על מנת ליצור את קובץ ה-package.json, גשו לתיקיית הפרויקט שלכם ופתחו את חלון הטרמינל, Git Bash או הטרמינל שנמצא בעורך הקוד שלכם והקישו את הפקודה הקצרה הבאה:
npm init
מיד תקבלו מספר "שאלות" על הפרויקט שאת חלקן הזכרתי קודם (שם הפרויקט, תיאור וכו').
טיפ: אם תרצו לדלג על כל השאלות האלו ואתם בסדר עם ערכי ברירת המחדל, תוכלו לעשות זו עם הפקודה הבאה:
npm init --yes
סיימתם? מזל טוב, קובץ ה-package.json נוצר בתיקיית הפרויקט שלכם.
התקנות מקומיות והתקנות גלובליות
כפי שכבר הבנתם, npm מאפשר לנו להתקין חבילות, אבל ניתן להתקין חבילה באופן מקומי או באופן גלובלי:
מקומי – המשמעות של התקנה מקומית היא שרק פרויקט זה יוכל לגשת אל ההרחבה ולהשתמש בה.
גלובלי – התקנה גלובלית משמעותה שכל הסביבה שלנו (כלומר המכונה שלנו) תכיר את ההרחבה ונוכל להשתמש בה בכל פרויקט שירוץ על המכונה.
התקנה של חבילה באופן מקומי:
npm install package
כעת ההרחבה הותקנה בפרויקט שלנו, אבל חסר עוד משהו אחד חשוב, זוכרים שאמרתי שעוד ארחיב על dependencies ו-devDependencies?
כאשר נתקין חבילה באופן מקומי, רצוי מאוד שנתעד את התקנה בקובץ package.json, זאת לצורך התקנה עתידית, מעקב, עדכון גרסאות וכו'.
הפקודה הבאה לא רק תתקין את ההרחבה, אלא גם תרשום אותה באובייקט devDependencies בקובץ ה-package.json שלנו:
npm install package --save-dev
אבל מה אם מדובר בהרחבה שהאפליקציה תצטרך גם בפרודקשן? הפעם נשתמש בדגל save–:
npm install package --save
כעת, הרחבה זו תהיה רשומה בתוך האובייקט dependencies ולא devDependencies כמו קודמתה.
כך למשל יראה קובץ package.json לאחר התקנת 2 הרחבות, אחת לפיתוח ואחת לפרודקשן:

התקנה של חבילה באופן גלובלי:
npm install --global package
את שמה של ההרחבה תראו בעמוד ההרחבה באתר הרשמי של npm.
הרחבה זו מותקנת בתיקייה כלשהי במחשב שלכם וכמו שכבר אמרתי, כל פרויקט יכיר אותה.
תיקיית node_modules
למקרה שפספסתם, לאחר התקנת החבילה הראשונה, נוצרה תיקייה נוספת בתיקיית הפרויקט שנקראית node_modules.
תיקייה זו מכילה את קבצי ההרחבות שהתקנו.
תיקייה זו תשקול לא מעט בדרך כלל ולכן כאשר נעלה את הפרויקט שלנו ל-GitHub למשל, לא נכלול אותה.
אבל רגע, אם לא נכלול את התיקייה, איך נגרום לפרויקט לעבוד? זו בידיוק הסיבה שאמרנו ל-npm לשמור את ההרחבות בקובץ ה-package.json תחת dependencies ו-devDependencies.
הפקודה הבאה "תלך" לקובץ package.json, תראה את ההרחבות השמורות שם ותתקין אותן בתיקיית node_modules בפרויקט שלנו:
npm install
פקודות npm שכדאי להכיר
רשימה קצרה של פקודות שכדאי להכיר:
npm uninstall package – תסיר את ההרחבה
npm uninstall package –save – תסיר את ההרחבה ואת התיעוד בקובץ package.json תחת dependencies
npm uninstall package –save-dev – תסיר את ההרחבה ואת התיעוד בקובץ package.json תחת devDependencies
npm install package@1.12.5 – התקנת גרסה ספציפית של הרחבה כלשהי
npm update package – תעדכן את ההרחבה לגרסה האחרונה
קיצורים
חשוב לדעת כי ניתן לקצר את הפקודות:
npm init -y //npm init --yes
npm i package //npm install package
npm up package //npm update package
npm un pakcage //npm uninstall package
npm i package -S //npm install package --save
npm i package -D //npm install package --save-dev
npm i package -g //npm install package -global
בנוסף, באפשרותנו להתקין מספר חבילות בפקודה אחת:
npm i package1 package2 package3 -D
בהצלחה!
נהנת ממאמר זה? הירשם לרשימת התפוצה וקבל עדכונים על מאמרים חדשים!
רק רגע! :)
כשאני לא כותב פוסטים ב-CodeBrain אני מספק שרותי פיתוח, ייעוץ והדרכה.
אם נראה לך שאני האיש המתאים עבורך, כדאי שנדבר :)
היי,
ראשית, שמחתי להכיר את האתר שלך.
אשמח להבין מדוע נוצר קובץ
package-locked.json
כאשר אני יוצר פרוייקט חדש?
אודה לעזרתך….
מתנצל על המענה מאוחר.
בטח התכוונת לקובץ package-lock.json, באופן כללי, קובץ זה נוצר כאשר התרחש שינוי בעץ התלויות הנוכחי והוא עוזר למנוע בעיות בהתקנות הבאות.
ממליץ לך לקרוא בהרחבה כאן:
https://docs.npmjs.com/files/package-lock.json
תודה רבה,
עזר לי מאד!!
יפה!
מה לגבי חבילות שמושתפות גם לסביבת פיתוח וגם לסביבת פרודקשן?
האם הן צריכות להיות כתובות פעמיים?
תודה רבה.
הי
באמת אתר מעניין וחמוד!
אולי תוכל לענות לי על בעיה בהתקנת אנגולר,
יכול להיות שבגלל שהשם משתמש שלי במחשב הוא בעברית אז זה יוצר לי בעיות?
כי ה CMD פונה אליו …C:\Users\XXX\AppData
ואם כן איך משנים את השם? (אין אפשרות במקש ימני על התיקייה)
תודה
היי
רציתי לדעת למה אני לא מצליחה לפתוח פרויקט חדש
לוקח לו הרבה מאוד זמן(מעל שעה)
יש לציין שניסיתי כמה דרכים כבר
תוכלי לפרט קצת יותר?
מה בדיוק עשית והאם את מקבלת הודעה כלשהי?
תודה רבה!
יש לי פרוייקט שהרצתי לפני שבוע
ועכשיו אני מנסה להריץ שוב ולא מצליחה
אשמח מאוד לעזרה