Sự khác nhau giữa NPM và NPX

Khi làm việc với các dự án Javascript kiểu như NodeJS, ReactJS, Vuejs… Chắc hẳn bạn đã từng gặp các bài hướng dẫn cài đặt các thư viện đúng không?

Và bạn có bao giờ thắc mắc tại sao lúc thì dùng npm, lúc lại npx không?

Bài viết hôm nay, mình sẽ giải thích thật ngắn gọn về hai công cụ này.

Sự khác nhau cơ bản giữa NPM vs NPX

Về cơ bản thì cả hai công cụ npm và npx đều là để quản lý các Packages – hay còn gọi là các thư viện Javascript.

Sự khác nhau duy nhất giữa chúng là:

• NPM (Node Package Manager) là chương trình quản lý các packages và không thực thi chúng.
• NPX (Npm Package Executor) , đúng như với tên gọi của nó, chương trình này có thể thực thi các package được lưu trữ trên npm

Như vậy, bản thân NPM chỉ đơn giản là cài đặt, tải các thư viện javascript được lưu trữ trên kho lưu trữ (có địa chỉ tại https://www.npmjs.com). Nếu bạn muốn chạy một package nào đó, bạn phải chỉ định nó trong tệp cấu hình package.json

Khi mà những thực thi được cài đặt thông qua npm. NPM sẽ tạo một liên kết đến những thực thi đó:

• Nếu lưu local thì package đó sẽ được lưu tại thư mục ./node_modules/.bin/ của dự án
• Nếu lưu global: package được lưu tại /usr/local/bin (đối với Linux) hoặc %AppData%/npm (đối với Window)

Như vậy, để thực thi một package bằng npm, từ cửa sổ lệnh (terminal) bạn phải đưa con trỏ tới đúng thư mục bin của package, rồi sau đó mới thực thi được.

Ví dụ: $ ./node_modules/.bin/my-package

Hoặc là chỉ định trong package.json:

{
  "name": "my-app",
  "version": "1.0.0",
  "scripts": {
    "my-package": "my-package"
  }
}

Rồi thực thi lệnh: $ npm run my-package

Với NPX, bạn sẽ không phải làm vậy, nó sẽ tự động tìm package đó. Bạn chỉ việc gõ lệnh: $ npx my-package

Ví dụ thực hành

Đọc xong phần lý thuyết trên, có lẽ vẫn hơi lằng nhằng khó hiểu phải không?

Để các bạn dễ hình dung hơn về sự khác nhau giữa npm vs npx, mình sẽ lấy ví dụ minh họa thực tế.

Khi bạn đọc các bài viết hướng dẫn về ReactJS, bạn thường hay khởi tạo dự án ReactJS bằng công cụ này đúng không: create-react-app. Câu lệnh mà bạn vẫn hay làm như sau:

$ npx create-react-app my-app

Chỉ với câu lệnh trên, npx sẽ tự động gọi thư viện create-react-app vào thực thi thư viện để tạo dự án có tên là my-app.

Đấy là với npx, nếu bạn thực hiện bằng công cụ npm thì sao?

Đầu tiên, bạn cần cài đặt công cụ create-react-app:

$ npm install -g create-react-app

Trong trường hợp bạn chưa cấu hình biến môi trường PATH trong trong máy tính thì bạn phải di chuyển con trỏ tới thư mục: /usr/local/bin/create-react-app

Sau đó mới gõ lệnh tạo my-app được:

$ create-react-app my-app

Bạn thấy sự tiện lợi của npx so với npm chưa?

Như vậy là mình đã chỉ ra xong dự khác biệt giữa hai công cụ thần thánh này. Hy vọng bạn cũng đã hiểu, và không còn nhầm lẫn nữa.

💥 Đọc bài viết hay ho khác về Javascript:

• 6 câu lệnh NPM hữu ích – Web dev mà bỏ qua sẽ vô cùng tiếc
• Node.js Module là gì? Cách tạo và sử dụng module trong nodejs
• Cách tích hợp ReactJS vào dự án website bất kỳ

​Đăng kí nhận sách ​dạy ​kiếm tiền từ ứng dụng di động

​Bạn đã bao giờ tự hỏi Hà Đông kiếm tiền tỷ từ ​Flappy Bird như nào không? ​Bạn biết cách lập trình nhưng lại không biết làm sao để kiếm được tiền từ nó?

Hiện cuốn sách đang bán rất chạy trên Amazon với giá 9.99$. Bạn có muốn nhận cuốn sách này để học kiếm tiền không? ​Đăng kí để nhận miễn phí nhé

DOWNLOAD