Package manager trong dự án Javascript, Node.js(Npm, yarn, pnpm)

Package Manager là gì?

Package manager (Trình quản lý gói) là công cụ tự động hoá các quy trình cài đặt, nâng cấp, cấu hình và quản lý các dependencies, libraries, frameworks trong dự án. Nó tự động hóa việc truy xuất, cài đặt và kiểm soát phiên bản của các gói này. Điều này cho phép các nhà phát triển tập trung vào việc xây dựng ứng dụng của họ thay vì quản lý các phụ thuộc theo cách thủ công.

Lợi ích của Package Manager

Quản lý phụ thuộc(Dependency Management)

Tự động hóa cài đặt các thư viện bên ngoài. Giải quyết và quản lý các phụ thuộc để phát triển hiệu quả.

Kiểm soát phiên bản(Version Control)

Đảm bảo các phiên bản phụ thuộc nhất quán. Cho phép cập nhật dễ dàng trong khi vẫn duy trì khả năng tương thích ngược.
Khóa các phiên bản của các gói để ngăn ngừa các lỗi không mong muốn do các bản cập nhật gây ra.

Kho lưu trữ tập trung(Centralized Repository)

Danh mục trực tuyến các gói. Đơn giản hóa việc khám phá gói, truy cập tài liệu và xếp hạng cộng đồng.

Hỗ trợ hệ sinh thái và cộng đồng (Community and Ecosystem)

Truy cập vào hệ sinh thái rộng lớn của các gói nguồn mở. Bảo trì, cập nhật và hỗ trợ do cộng đồng thúc đẩy.

Chia sẻ hiệu quả

Cho phép các member trong nhóm của bạn sao chép môi trường của bạn chỉ bằng một lệnh duy nhất(npm install, yarn install,..)

Performance

Tăng tốc việc cài đặt và update bằng cách sử dụng caching và dependency resolution

Các package manager phổ biến

Đối với Javascript và các dự án Node.js, có 1 số package manager phổ biến như: npm(Node Package Manager), yarn, and pnpm. Mỗi package manager cung cấp các tính năng và lợi ích riêng phục vụ cho các quy trình phát triển khác nhau.

npm (Node Package Manager):

Được tạo từ năm 2010, là package manager mặc định của Node.js
Trình quản lý gói mặc định cho Node.js.
Được sử dụng để cài đặt và quản lý các gói Node.js.

Yarn:

Được tạo từ năm 2016 bởi Facebook
Một trình quản lý gói nhanh, đáng tin cậy và an toàn.
Được tối ưu hóa cho hiệu suất với các cài đặt song song(parallel installations) và caching

pnpm(Performant NPM):

Một trình quản lý gói hiệu suất cao giúp giảm thiểu việc sử dụng dung lượng disk.
Tối ưu hóa tốc độ cài đặt và giải quyết sự phụ thuộc.

Bảng so sánh giữa các Package Manager

Tính Năng	NPM	Yarn	PNPM
Lockfile	package-lock.json	yarn.lock	pnpm-lock.yaml
Tốc Độ Cài Đặt	Trung Bình	Nhanh	Rất Nhanh
Sử Dụng Dung Lượng Ổ Đĩa	Cao	Cao	Thấp
Node Modules	Cấu Trúc Phẳng	Cấu Trúc Phẳng	Symlinked
Hỗ Trợ Workspaces	Có (v7+)	Có	Có
Hỗ Trợ Monorepo	Cơ Bản	Xuất Sắc	Xuất Sắc
Hổ trợ Parallel Installs	No	Yes	Yes
Kiểm Tra Phụ Thuộc Nghiêm Ngặt	Không	Không	Có

Cách sử dụng Package Manager Cơ bản

Ở đây mình sẽ lấy npm làm ví dụ.

Bước 1: Tạo folder dự án

mkdir demo-npm
cd demo-npm

Bước 2: Khởi tạo dự án.

npm init -y

Sau khi chạy lệnh trên thì sẽ tạo ra 1 file package.json với nội dung như sau:

{
  "name": "demo-npm",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "description": ""
}

Bước 3: Thêm package vào dự án.

Ở đây mình sẽ thêm package axios vào dự án.

# Cài version mới nhất: 
npm install axios

# Cài version cụ thể:
npm install axios@1.7.5

Lệnh trên sẽ thực hiện các công việc sau:

Kết nối tới central repository để tìm và tải xuống các tập tin cần thiết của gói axios
Các tập tin được tải xuống sẽ lưu vào thư mục: node_modules

.
├── node_modules
│   ├── asynckit
│   ├── axios
│   ├── combined-stream
│   ├── delayed-stream
│   ├── follow-redirects
│   ├── form-data
│   ├── mime-db
│   ├── mime-types
│   └── proxy-from-env
├── package-lock.json
└── package.json

Thay đổi file package.json:

{
  ...
  "description": "",
  "dependencies": {
    "axios": "^1.7.5"
  }
}

Tạo hoặc update file package-lock.json

{
  "name": "demo-npm",
  "version": "1.0.0",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "demo-npm",
      "version": "1.0.0",
      "license": "ISC",
      "dependencies": {
        "axios": "^1.7.5"
      }
    },
    "node_modules/axios": {
      "version": "1.7.5",
      "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.5.tgz",
      "integrity": "sha512-fZu86yCo+svH3uqJ/yTdQ0QHpQu5oL+/QE+QPSv6BZSkDAoky9vytxp7u5qk83OJFS3kEBcesWni9WTZAv3tSw==",
      "dependencies": {
        "follow-redirects": "^1.15.6",
        "form-data": "^4.0.0",
        "proxy-from-env": "^1.1.0"
      }
    },
    "node_modules/form-data": {
      "version": "4.0.1",
      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.1.tgz",
      "integrity": "sha512-tzN8e4TX8+kkxGPK8D5u0FNmjPUjw3lwC9lSLxxoB/+GtsJG91CO8bSWy73APlgAZzZbXEYZJuxjkHH2w+Ezhw==",
      "dependencies": {
        "asynckit": "^0.4.0",
        "combined-stream": "^1.0.8",
        "mime-types": "^2.1.12"
      },
      "engines": {
        "node": ">= 6"
      }
    },
    ...
  }
}

File package-lock.json này sẽ lock cố định phiên bản của các gói mà dự án sử dụng. Việc này giúp đảm bảo các phiên bản phụ thuộc nhất quán. Ví dụ axios phát hành thêm 1 phiên bản mới là 1.7.6 nhưng phiên bản này không tương thích với code trong dự án thì cũng không sao vì ta đã lock cứng phiên bản 1.7.5.

Để ý file package-lock.json ta sẽ thấy có vài package lạ được thêm vào như: form-data. Điều này là do package axios có khai báo yêu cầu dependency form-data trong file package.json vì vậy lúc cài axios sẽ tự động cài các dependency được khai báo đó vào theo.

{
  "dependencies": {
    "follow-redirects": "^1.15.6",
    "form-data": "^4.0.0",
    "proxy-from-env": "^1.1.0"
  },
}

Bước 4. Chia sẻ với các thành viên trong nhóm

Bạn cần đẩy code lên bao gồm các thay đổi ở file package.json và package-lock.json để các thành viên trong nhóm của bạn có thể cài đặt đẩy đủ các package được khai báo cũng như chính xác phiên bản đang sử dụng.

Bước 5. Cài đặt các gói phụ thuộc trong dự án(Resolving Dependencies)

Để cài đặt các gói phụ thuộc trong dự án, Các thành viên trong nhóm của bạn cần di chuyển đến thư mục dự án và chạy lệnh sau:

npm install

Lệnh này sẽ kiểm tra và tải các tập tin cần thiết của các gói(bao gồm cụ thể phiên bản) được khai báo trong package-lock.json và package.json

Lưu ý

Sử dụng chính xác package manager dự án đang sử dụng

Khi cài đặt môi trường của 1 dự án có sẵn, bạn cần kiểm tra xem dự án của nhóm bạn đang dùng package manager nào để sử dụng lệnh cài đặt chính xác.

# dùng lệnh sau để kiểm tra nhanh
ls  | grep lock

Nếu bạn thấy hệ thống có file: package-lock.json thì bắt buộc bạn sử dụng lệnh npm install để cài đặt các gói phụ thuộc.
Nếu bạn thấy hệ thống có file: yarn.lock thì bắt buộc bạn sử dụng lệnh npm install để cài đặt các gói phụ thuộc.
Nếu bạn thấy hệ thống có file: pnpm-lock.yaml thì bắt buộc bạn sử dụng lệnh pnpm install để cài đặt các gói phụ thuộc.

Ví dụ dự án sử dụng `yarn` để quản lý dependency

Các phiên bản sẽ được lock vào trong file yarn.lock yarn cache lại các package.

Lệnh cài đặt đúng: `yarn install`

yarn sẽ kiểm tra yarn.lock và cài đặt các gói phụ thuộc với phiên bản cụ thể đã được khai báo, ngoài ra caching cũng được tận dụng để việc cài đặt nhanh hơn.

Lệnh cài đặt sai: `npm install`

Nếu bạn chạy lệnh npm install npm sẽ kiểm tra xem có tồn tại file package-lock.json hay không? Nếu có thì npm sẽ tải các gói với phiên bản được khai báo trong package-lock.json.

Ở trường hợp này tất nhiên là không có package-lock.json, npm sẽ dựa vào package.json kết nối tới central repository để tìm các phiên bản phù hợp của các gói tin và tải chúng xuống. Việc này sẽ tốn khá rất lâu để hoàn thành, ngoài ra hàng loạt gói phụ thuộc sẽ bị nâng version lên, Điều này có thể gây ra các lỗi không tương thích cho dự án hiện tại của bạn.

Kết luận

Trình quản lý gói là xương sống của quá trình phát triển JavaScript, đảm bảo quản lý phụ thuộc liền mạch và quy trình làm việc hợp lý. Mặc dù NPM, Yarn và PNPM đều có thế mạnh riêng, nhưng lựa chọn tốt nhất phụ thuộc vào yêu cầu của dự án và sở thích của nhóm bạn.

Package manager trong dự án Javascript, Node.js(Npm, yarn, pnpm)

Package Manager là gì?

Lợi ích của Package Manager

Quản lý phụ thuộc(Dependency Management)

Kiểm soát phiên bản(Version Control)

Kho lưu trữ tập trung(Centralized Repository)

Hỗ trợ hệ sinh thái và cộng đồng (Community and Ecosystem)

Chia sẻ hiệu quả

Performance

Các package manager phổ biến

npm (Node Package Manager):

Yarn:

pnpm(Performant NPM):

Bảng so sánh giữa các Package Manager

Cách sử dụng Package Manager Cơ bản

Bước 1: Tạo folder dự án

Bước 2: Khởi tạo dự án.

Bước 3: Thêm package vào dự án.

Bước 4. Chia sẻ với các thành viên trong nhóm

Bước 5. Cài đặt các gói phụ thuộc trong dự án(Resolving Dependencies)

Lưu ý

Sử dụng chính xác package manager dự án đang sử dụng

Ví dụ dự án sử dụng `yarn` để quản lý dependency

Lệnh cài đặt đúng: `yarn install`

Lệnh cài đặt sai: `npm install`

Kết luận

Liên Kết Tham khảo

Table of Contents

Package Manager là gì?

Lợi ích của Package Manager

Quản lý phụ thuộc(Dependency Management)

Kiểm soát phiên bản(Version Control)

Kho lưu trữ tập trung(Centralized Repository)

Hỗ trợ hệ sinh thái và cộng đồng (Community and Ecosystem)

Chia sẻ hiệu quả

Performance

Các package manager phổ biến

npm (Node Package Manager):

Yarn:

pnpm(Performant NPM):

Bảng so sánh giữa các Package Manager

Cách sử dụng Package Manager Cơ bản

Bước 1: Tạo folder dự án

Bước 2: Khởi tạo dự án.

Bước 3: Thêm package vào dự án.

Bước 4. Chia sẻ với các thành viên trong nhóm

Bước 5. Cài đặt các gói phụ thuộc trong dự án(Resolving Dependencies)

Lưu ý

Sử dụng chính xác package manager dự án đang sử dụng

Ví dụ dự án sử dụng yarn để quản lý dependency

Lệnh cài đặt đúng: yarn install

Lệnh cài đặt sai: npm install

Kết luận

Liên Kết Tham khảo

Table of Contents

Ví dụ dự án sử dụng `yarn` để quản lý dependency

Lệnh cài đặt đúng: `yarn install`

Lệnh cài đặt sai: `npm install`