วิธีเปิดใช้งานและใช้ npm (Node.js Package Manager) ใน ServBay

npm (Node Package Manager) คือเครื่องมือจัดการแพ็กเกจอย่างเป็นทางการของ Node.js และเป็นคลังซอฟต์แวร์โอเพนซอร์สที่ใหญ่ที่สุดในโลก สำหรับนักพัฒนา Node.js แล้ว npm เป็นเครื่องมือที่ขาดไม่ได้ ช่วยให้คุณติดตั้ง แชร์ และจัดการ dependencies ของโค้ดในโปรเจกต์ได้อย่างง่ายดาย ด้วยสภาพแวดล้อมแบบครบวงจรจาก ServBay คุณสามารถเริ่มใช้ npm เพื่อพัฒนาได้อย่างรวดเร็ว

ข้อกำหนดเบื้องต้น

ก่อนใช้ npm คุณต้องติดตั้ง Node.js ใน ServBay ให้เรียบร้อย

1. เปิดแอปพลิเคชัน ServBay
2. ไปที่แผง “แพ็กเกจ” (Packages)
3. ค้นหาแพ็กเกจ Node.js และตรวจสอบว่าติดตั้งเรียบร้อยและกำลังทำงาน

ServBay จะตั้งค่าสภาพแวดล้อม Node.js ให้คุณโดยอัตโนมัติ ซึ่งรวมถึง npm ด้วย

ตรวจสอบว่าได้ติดตั้ง npm แล้วและพร้อมใช้งาน

Node.js ที่ติดตั้งผ่าน ServBay มาพร้อมกับ npm และเปิดใช้งานโดยค่าเริ่มต้น คุณสามารถตรวจสอบได้อย่างรวดเร็วผ่านเทอร์มินัลว่า npm ถูกติดตั้งและใช้งานได้หรือไม่

1. เปิดแอปเทอร์มินัลของคุณ (เช่น Terminal ของ macOS)

2. ป้อนคำสั่งต่อไปนี้เพื่อดูเวอร์ชันของ npm:

   npm -v

   หากคำสั่งทำงานสำเร็จและแสดงเวอร์ชัน (เช่น 10.2.0 หรือใหม่กว่า) แสดงว่า npm ถูกติดตั้งและพร้อมใช้ในสภาพแวดล้อมปัจจุบันของคุณ

   # ตัวอย่างผลลัพธ์
   10.2.0

   หากคุณเห็นข้อความ error ลักษณะว่า “command not found: npm” ให้ตรวจสอบให้แน่ใจว่าคุณติดตั้งแพ็กเกจ Node.js ผ่าน ServBay แล้ว และ Environment Variable ของ ServBay ถูกโหลดอย่างถูกต้อง (โดยส่วนใหญ่มักจะแก้ไขได้ด้วยการปิดแล้วเปิดเทอร์มินัลหรือรีสตาร์ทเครื่องใหม่)

อัปเดต npm

แม้ว่า Node.js ที่มาพร้อม ServBay จะรวม npm เวอร์ชันเสถียรแล้ว แต่ตัว npm เองก็มีการอัปเดตบ่อยครั้งเพื่อเพิ่มฟีเจอร์และแก้ไขปัญหา คุณสามารถอัปเดต npm เป็นเวอร์ชันล่าสุดได้ด้วยตัวมันเองดังนี้

npm install -g npm@latest

คำสั่งนี้จะติดตั้ง npm เวอร์ชันล่าสุดแบบ global (ตัวเลือก -g) เพื่อให้คุณใช้งานกับคำสั่ง npm จากทุกที่ในระบบ

หลังจากอัปเดตให้รัน npm -v อีกครั้งเพื่อยืนยันเวอร์ชัน

npm -v

ฟีเจอร์หลักและวิธีใช้เบื้องต้นของ npm

พลังของ npm อยู่ที่ระบบ ecosystem ขนาดใหญ่และความง่ายในการจัดการ dependencies ต่อไปนี้คือตัวอย่างสถานการณ์การใช้งานจริงและคำสั่งสำคัญที่ใช้บ่อยกับ npm

เริ่มโปรเจกต์ Node.js ใหม่

หากคุณต้องการเริ่มโปรเจกต์ Node.js ใหม่ในโฟลเดอร์เปล่า สามารถใช้คำสั่ง npm init เพื่อสร้างไฟล์ package.json ซึ่งเป็นหัวใจสำคัญของโปรเจกต์ ระบุข้อมูล meta, dependencies และ script ต่าง ๆ

cd /Applications/ServBay/www/my-new-project.servbay.demo
npm init

npm init จะนำคุณกรอกข้อมูลชื่อโปรเจกต์ เวอร์ชัน คำอธิบาย ไฟล์หลัก ฯลฯ หรือหากต้องการสร้างไฟล์ package.json ปริยายอย่างรวดเร็ว ให้ใช้ npm init -y

ติดตั้ง dependencies ของโปรเจกต์

ใน root directory ของโปรเจกต์ (ตำแหน่งที่มีไฟล์ package.json) คุณสามารถติดตั้ง dependencies ทั้งหมดได้ด้วยคำสั่ง

cd /Applications/ServBay/www/my-project.servbay.demo
npm install

คำสั่งนี้จะอ่าน dependencies และ devDependencies ใน package.json และติดตั้งโมดูลต่าง ๆ ลงในโฟลเดอร์ node_modules ของโปรเจกต์

เพิ่ม dependencies ใหม่

หากต้องการนำ library หรือ framework ใหม่มาใช้งานในโปรเจกต์ ให้ใช้คำสั่ง npm install <package-name>

# ติดตั้ง dependencies สำหรับการรันจริง เช่น Express
npm install express

# ติดตั้ง dependencies เฉพาะสำหรับพัฒนา เช่น Mocha
npm install mocha --save-dev

ปกติแล้ว npm install <package-name> จะติดตั้งแพ็กเกจลงใน node_modules ของโปรเจกต์และอัปเดตฟิลด์ dependencies ใน package.json อัตโนมัติ หากใช้ --save-dev แพ็กเกจจะถูกเพิ่มไปยัง devDependencies เหมาะกับเครื่องมือทดสอบหรือ build tools

ลบ dependencies ออกจากโปรเจกต์

หากคุณไม่ต้องการ dependency ใด ๆ แล้ว ใช้คำสั่ง npm uninstall <package-name>

npm uninstall express

คำสั่งนี้จะลบแพ็กเกจทั้งจาก node_modules และอัปเดต package.json อัตโนมัติ

อัปเดต dependencies ของโปรเจกต์

เพื่อให้มั่นใจว่า dependencies ในโปรเจกต์ใหม่ตามจริง (ในขอบเขตที่ระบุใน package.json) ให้ใช้

npm update

คำสั่งนี้จะตรวจสอบและอัปเดตแพ็กเกจที่ติดตั้งไว้ใน node_modules โดยอิงจากเวอร์ชันที่กำหนดใน package.json

การใช้งาน npm scripts

ในไฟล์ package.json ฟิลด์ scripts ช่วยให้คุณสร้างคำสั่งอัตโนมัติ เช่น รันเซิร์ฟเวอร์, ทดสอบ, สร้างโปรเจกต์ ฯลฯ ตัวอย่างเช่น คุณอาจกำหนด script แบบนี้

{
  "name": "my-project",
  "version": "1.0.0",
  "scripts": {
    "start": "node index.js",
    "test": "mocha test/**/*.js",
    "build": "webpack --config webpack.config.js"
  },
  "dependencies": {
    "express": "^4.18.2"
  },
  "devDependencies": {
    "mocha": "^10.2.0",
    "webpack": "^5.89.0"
  }
}

จากนั้นคุณสามารถรันคำสั่ง script เหล่านี้ในเทอร์มินัลได้ง่าย ๆ ด้วย

# เริ่มแอปพลิเคชัน
npm start

# รันทดสอบ
npm test

# สร้างโปรเจกต์
npm run build

หมายเหตุ: สำหรับชื่อสคริปต์บางชื่อ เช่น start, test, install, restart, stop คุณสามารถเรียกได้ตรง ๆ โดยไม่ต้องพิมพ์ run เช่น npm start, npm test เป็นต้น

สรุปคำสั่ง npm ที่ใช้งานบ่อย

นอกจากฟีเจอร์หลักข้างต้นแล้ว ยังมีคำสั่งที่ใช้บ่อยอื่น ๆ ได้แก่

• ติดตั้งแพ็กเกจแบบ global: ใช้เมื่อต้องการติดตั้งเครื่องมือ CLI ที่ใช้ได้จากทุกที่ในระบบ

  npm install -g <package-name>
  # ตัวอย่าง ติดตั้ง npx สำหรับรันคำสั่งชั่วคราว (โดยมากจะมากับ Node.js แล้ว)
  npm install -g npx
  # ตัวอย่าง ติดตั้ง nodemon ที่ช่วยให้รีสตาร์ทแอปอัตโนมัติขณะพัฒนา
  npm install -g nodemon

• รันคำสั่งชั่วคราวด้วย npx: npx เป็นเครื่องมือที่มาพร้อมกับ npm 5.2+ ใช้สำหรับรัน executable จาก node_modules/.bin หรือดาวน์โหลดและรัน command จากแพ็กเกจโดยไม่ต้องติดตั้ง global

  # สร้างแอป React ใหม่โดยไม่ต้องติดตั้ง create-react-app แบบ global
  npx create-react-app my-react-app

• ดูรายการแพ็กเกจที่ติดตั้งแบบ global: แสดงรายชื่อและเวอร์ชันของแพ็กเกจ global ทั้งหมด

  npm list -g --depth=0

• ล้างแคชของ npm: หากพบปัญหาการติดตั้ง อาจเกิดจากแคชเสียหาย การล้างแคชช่วยแก้ไขปัญหาได้

  npm cache clean --force

• ดูข้อมูลของแพ็กเกจ: ดูรายละเอียดเวอร์ชัน, dependencies และข้อมูลอื่น ๆ

  npm view <package-name>

• ค้นหาแพ็กเกจ: ค้นหาแพ็กเกจจาก npm registry

  npm search <keyword>

การแก้ไขปัญหาเบื้องต้น

• npm command not found: ตรวจสอบว่าคุณติดตั้ง Node.js ผ่าน ServBay แล้ว และเทอร์มินัลของคุณเข้าถึง path ที่ติดตั้งได้ โดยมากการปิด-เปิดเทอร์มินัลหรือรีสตาร์ทเครื่องใหม่แก้ปัญหานี้ได้
• ติดตั้ง dependencies ไม่สำเร็จ: ตรวจสอบการเชื่อมต่ออินเทอร์เน็ตของคุณ บางครั้งการตั้งค่าพร็อกซีในบริษัทอาจมีผลต่อ npm อาจต้องตั้งค่า proxy ของ npm หรือทดลองล้างแคช (npm cache clean --force) แล้วติดตั้งใหม่
• ปัญหาเรื่องสิทธิ์ (Permissions): ใน macOS การติดตั้ง global (npm install -g) อาจเจอปัญหาสิทธิ์ แนะนำให้ใช้ Node Version Manager (nvm) หรือมั่นใจว่า ServBay กำหนด path ติดตั้งถูกต้อง หลีกเลี่ยงการใช้ sudo กับการติดตั้งแบบ global เพราะอาจนำไปสู่ปัญหาอื่น ๆ ในอนาคต โดยปกติ Node.js ที่ ServBay ติดตั้งจะแก้ไขเรื่อง permissions ให้แล้ว ช่วยให้คุณทำงานใน directory ของ ServBay ได้อย่างปลอดภัย

สรุป

ด้วย ServBay คุณสามารถมีสภาพแวดล้อม Node.js ที่ครบถ้วนบนเครื่อง และเริ่มใช้งาน npm อันทรงพลังเพื่อจัดการแพ็กเกจและพัฒนาโปรเจกต์ของคุณ เรียนรู้วิธีใช้คำสั่งและฟีเจอร์พื้นฐานของ npm จะช่วยให้คุณเพิ่มประสิทธิภาพการพัฒนาได้อย่างมาก เมื่อคุณทำงานกับ ecosystem ของ Node.js มากขึ้น npm จะกลายเป็นคู่หูที่ขาดไม่ได้ในเส้นทางนักพัฒนาของคุณ