Ra mắt hai series mới cực hot Trí tuệ nhân tạo A đến ZPython công cụ không thể thiếu khi nghiên cứu Data science, Machine learning.

NPM là công cụ gì?

Trong rất nhiều các bài viết chúng ta thường nói đến việc cài đặt các gói thư viện lập trình thông qua npm nhưng đôi khi chúng ta thực hiện mà chưa hiểu thực sự npm là gì? Bài viết này sẽ giúp bạn có cái nhìn tổng quan về các công cụ quản lý thư viện lập trình.

Npm

NPM công cụ quản lý thư viện lập trình cho Javascript

NPM viết tắt của Node package manager là một công cụ tạo và quản lý các thư viện lập trình Javascript cho Node.js, công cụ này là thật sự cần thiết cho thế giới mã nguồn mở. Trong cộng đồng Javascript, các lập trình viên chia sẻ hàng trăm nghìn các đoạn code giúp cho các dự án mới tránh phải viết lại các thành phần cơ bản, các thư viện lập trình hay thậm chí cả các framework. Mỗi đoạn code này có thể phụ thuộc vào rất nhiều các mã nguồn mở khác, thật may mắn khi các công cụ quản lý thư viện ra đời, nếu không sẽ mất rất nhiều công sức trong việc quản lý các thư viện này.

Nếu các bạn đã làm việc với Javascript lâu rồi thì ít nhiều cũng đã nghe tới npm, ngay lần đầu tiên khi tiếp xúc với khái niệm npm tôi cũng luôn tự hỏi npm là gì và qua một thời gian sử dụng theo kiểu thực hành trước hiểu sau, tôi đã hiểu được nó chính là công cụ quản lý thư viện lập trình cho Javascript. Nhân tiện đây, chúng ta phải nói đến Yarn một công cụ tương tự npm, được Facebook phát triển với nhiều tính năng vượt trội có khả năng sẽ thay thế npm. Nếu bạn đã biết đến Composer là công cụ quản lý thư viện cho PHP thì NPM chính là công cụ quản lý thư viện cho Javascript.

Cài đặt npm

Để kiểm tra xem trên hệ thống của bạn đã được cài npm chưa chúng ta sử dụng lệnh npm -v, nếu một phiên bản hiện ra thì hệ thống của bạn đã được cài đặt npm:

C:\Users\Admin>npm -v
4.5.0

npm cũng cần có node.js mới chạy được, do đó cần cài đặt cả Node.js. Từ phiên bản Node.js v0.6.3, bản cài đặt Node.js được tích hợp luôn npm do đó khi cài đặt chúng ta chỉ cần cài Node.js là đã có npm. Kiểm tra xem hệ thống đã cài đặt Node.js chưa, sử dụng câu lệnh node -v

C:\Users\Admin>node -v
v6.10.1

Chú ý, vì phiên bản của Node.js ra chậm hơn so với npm do đó, khi cài đặt bằng bộ cài Node.js, chúng ta nên thực hiện cập nhật để có được phiên bản npm mới nhất bằng câu lệnh npm install npm@latest -g.

C:\Users\Admin>npm install npm@latest -g
C:\Users\Admin\AppData\Roaming\npm\npm -> C:\Users\Admin\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js
C:\Users\Admin\AppData\Roaming\npm`-- npm@4.5.0

Cài đặt các gói thư viện lập trình thông qua npm

Bạn muốn cài đặt một gói thư viện lập trình cho dự án, sử dụng cú pháp

npm install <package name>

Ví dụ cài đặt framework Vue.js chúng ta thực hiện lệnh

npm install vue

Khi đó muốn sử dụng Vue.js chúng ta chỉ cần sử dụng lệnh require():

var Vue = require('vue');

Cài đặt toàn cục và cài đặt cục bộ

Có hai cách để cài đặt một gói bằng npm là cài đặt toàn cục hoặc cài đặt cục bộ.

  • Cài đặt cục bộ sẽ tạo ra thư mục node_modules nếu chưa có trong dự án hoặc nếu có rồi nó sẽ lấy mã nguồn của gói cần cài đặt đưa vào đây, do đó khi cần thiết sử dụng các gói này bạn có thể sử dụng lệnh require().
  • Cài đặt toàn cục sẽ lưu trữ mã nguồn của gói trong các file hệ thống không liên quan gì đến thư mục nơi đặt dự án của bạn, không thể sử dụng require() để sử dụng các gói mà chỉ có thể dùng các gói này thông qua các hàm CLI (Command Line Interface).

Kiểm tra các gói cài đặt

Để kiểm tra các gói đã được cài đặt thông qua npm sử dụng câu lệnh npm ls, nếu kiểm tra các cài đặt toàn cục thêm tham số -g (global)

npm ls
npm ls -g

Package.json

Cách tốt nhất để quản lý các gói cài đặt cục bộ bằng npm là thông qua file package.json là file nằm trong thư mục gốc của dự án. File này chứa các nội dung:

  • Các gói thư viện lập trình mà dự án sử dụng.
  • Cho phép xác định phiên bản chính xác của các gói thư viện lập trình được sử dụng.
  • Các gói bạn xây dựng có thể chia sẻ dễ dàng với các lập trình viên khác trên toàn cầu thông qua npm.

Lệnh npm init --yes sẽ tạo ra file package.json mẫu.

npm init --yes
Wrote to /home/ag_dubs/my_package/package.json:

{
  "name": "my_package",
  "description": "",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/ashleygwilliams/my_package.git"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/ashleygwilliams/my_package/issues"
  },
  "homepage": "https://github.com/ashleygwilliams/my_package"
}

Có một số các thuộc tính trong package.json, chúng ta cùng điểm qua:

  • name: tên gói thư viện lập trình
  • version: phiên bản gói
  • description: phần mô tả về gói thư viện
  • homepage: trang chủ của gói
  • author: tác giả
  • contributors: tên người đóng góp cho package
  • dependencies: danh sách các gói phụ thuộc, tự động được cài theo.
  • repository: loại repository và url của package, thông thường là git (Xem thêm Git là gì?)
  • main: luôn luôn là index.js
  • keywords: các từ khóa

Bạn có thể thiết lập một số các thuộc tính này thông qua sử dụng các câu lệnh

> npm set init.author.email "wombat@npmjs.com"
> npm set init.author.name "ag_dubs"
> npm set init.license "MIT"

Ví dụ sử dụng file package.json, dự án sử dụng gói my_package với phiên bản là v1 khi triển khai dự án và sử dụng gói my_develop_package trong quá trình xây dựng ứng dụng với phiên bản chính xác là v3.0, file package.json sẽ như sau:

{
  "name": "my_package",
  "version": "1.0.0",
  "dependencies": {
    "my_package": "^1.0.0"
  },
  "devDependencies" : {
    "my_develop_package": "^3.1.0"
  }
}

Nếu muốn thêm các entry vào thuộc tính dependencies khi cài đặt gói sử dụng thêm cờ --save, còn với thuộc tính devDependencies thì sử dụng cờ --save-dev. ## Xác định phiên bản gói thư viện lập trình

Khi cài đặt một gói thư viện, bạn có thể xác định phiên bản của gói để npm biết thực thi. Ví dụ, khi cài đặt Vue.js chúng ta có thể có các phiên bản như sau:

  • 2.1.10
  • 2.1.10

  • =2.1.10

  • ~2.1.10

Ví dụ về file package.json khi cài đặt Vue.js và Vue-router

"devDependencies": {
    "axios": "^0.15.3",
    "bootstrap-sass": "^3.3.7",
    "cross-env": "^3.2.3",
    "jquery": "^3.1.1",
    "laravel-mix": "0.*",
    "lodash": "^4.17.4",
    "vue": "^2.1.10",
    "vue-router": "^2.5.3"
  }

Vậy ^2.1.10 là gì? Chúng ta có thể xác định phiên bản một cách chính xác hoặc xác định theo một dải phiên bản. ### Xác định chính xác phiên bản

Nếu muốn sử dụng chính xác phiên bản Vue.js 2.1.10 thì bạn có thể sử dụng một trong 3 cách viết sau: 2.1.10 hoặc =2.1.10 hoặc v2.1.10. Rất ít khi sử dụng phiên bản cụ thể vì như vậy khi cập nhật các phiên bản mới, npm sẽ bỏ qua gói thư viện này. Xác định chính xác phiên bản khi bạn thấy một phiên bản của gói thư viện nào đó là quá đủ với bạn.

Xác định phiên bản theo dải

Như đã nói ở trên, xác định phiên bản chính xác sẽ bỏ qua các cập nhật phiên bản mới, trong các phiên bản mới có thêm nhiều tính năng hoặc có các phiên bản sửa lỗi cho các phiên bản cũ, do vậy xác định phiên bản theo dải thường được sử dụng, tuy nhiên trong thực tế có nhiều phiên bản mới phá vỡ cấu trúc của phiên bản cũ dẫn đến hệ thống của bạn không chạy khi nâng cấp do vậy xác định phiên bản theo dải cũng cần hạn chế không nên sử dụng lastest.

"devDependencies": {
...
    "vue": "lastest",
...
  }

Khi đó nếu cập nhật tất cả các gói phụ thuộc dự án bằng lệnh npm update thì nó sẽ lấy về phiên bản mới nhất nếu có các phiên bản mới. Có rất nhiều các chuỗi ký tự giúp định nghĩa dải phiên bản, chúng ta cùng xem bảng ý nghĩa cho từng dải phiên bản sau:

Phiên bản Mô tả
latest Lấy phiên bản mới nhất nếu có, không nên sử dụng do các phiên bản mới có thể phá hỏng kiến trúc phiên bản cũ.
*, x Lấy bất kỳ phiên bản nào có thể.
2, 2.*, 2.x, ~2,^2 Lấy bất kỳ phiên bản có phiên bản chính là 2 và lấy phiên bản mới nhất có thể trong dải.
>2.1.10 Chọn bất kì phiên bản nào lớn hơn một phiên bản xác định, không nên sử dụng có thể phá hỏng kiến trúc làm hệ thống không hoạt động như lastest
<2.1.10 Chọn bất kì phiên bản nào nhỏ hơn một phiên bản nhất định.
>=2.1.10 Bất kì phiên bản nào lớn hơn hoặc bằng một phiên bản xác định.
<=2.1.10 Bất kì phiên bản nào nhỏ hơn hoặc bằng phiên bản một phiên bản xác định.
2.1.3 – 2.1.10 Lấy bất kì phiên bản nào trong khoảng từ phiên bản 2.1.3 đến 2.1.10
~2.1.10 Lấy bất kì phiên bản nào lớn hơn hoặc bằng 2.1.10, nhỏ hơn 2.2 và tương thích với 2.1.10
~2.1 Lấy bất kì phiên bản nào lớn hơn hoặc bằng 2.1, nhỏ hơn 3.0 và tương thích với 2.1
^2.1.10 Lấy bất kì phiên bản nào tương thích với phiên bản 2.1.10, có thể trong lần cập nhật tới sẽ là phiên bản 3.0.0, đây là dải phiên bản hay được sử dụng nhất

Các hành động thông qua sử dụng npm

Gỡ bỏ cài đặt gói thư viện

Trong thực tế, đôi khi có những gói thư viện bạn đã cài đặt nhưng sau đó bạn không sử dụng đến trong dự án, bạn có thể gỡ bỏ cài đặt một gói thông qua câu lệnh npm uninstall <package_name>. Ví dụ:

npm uninstall vue-router

Sau đó bạn có thể kiểm tra thư mục node_modules hoặc kiểm tra các danh sách gói được cài đặt thông qua câu lệnh npm ls

Cập nhật phiên bản cho gói thư viện

Các gói thư viện đưa vào dự án của bạn có thể liên tục có các phiên bản mới, bạn chỉ cần xác định phiên bản cho các gói này và thực hiện npm update để thực hiện cập nhật tất cả các gói liên quan. Nếu bạn chỉ muốn cập nhật một gói cụ thể có thể sử dụng cú pháp npm update <package_name>. Các câu lệnh này có thể sử dụng cờ -g (global) để thực hiện cập nhật cho các gói được cài đặt toàn cục.

npm update
npm update vuex

Lời kết

Qua bài viết bạn đã có cái nhìn tương đối toàn diện về NPM công cụ quản lý thư viện lập trình Javascript cho dự án, bạn cũng có thể sử dụng NPM hiệu quả hơn với việc xác định phiên bản các gói thư viện liên quan. NPM hay Yarn đều có những cơ sở kiến thức chung, bài viết này cũng giúp cho các bạn tìm hiểu về Yarn kiến thức nền tảng sử dụng package.json, tuy có một số khác biệt trong việc cập nhật phiên bản thông qua file yarn.lock.


CÁC BÀI VIẾT KHÁC

FirebirD

Đam mê Toán học, Lập trình. Sở thích chia sẻ kiến thức, Phim hài, Bóng đá, Cà phê sáng với bạn bè.

Yarn là gì? tại sao Yarn đang thay thế dần npm

Hướng dẫn Webpack cơ bản

7 Bình luận trong "NPM là công cụ gì?"

  1. Duc

    5 years ago

    Phản hồi
    npm install chạy lâu vãi, có những project em chạy mất vài tiếng mới xong. Em dùng Windows 7.1, node 6.10.1, npm 4.5.0. các bác có cách nào không chứ ức chế quá.
    1. FirebirD

      5 years ago

      Phản hồi
      Bạn thử cài đặt Node.js bản mới nhất và update của npm lên xem có ổn không
      1. Duc

        5 years ago

        Phản hồi
        Mình thử rồi nhưng có chạy vẫn vậy
    2. Quang Tèo

      5 years ago

      Phản hồi
      To Duc: chạy thử hai lệnh này xem thế nào nhé npm set progress=false npm config set registry http://registry.npmjs.org/ Lệnh thứ nhất tắt cái progress bar đi, giúp npm chạy nhanh hơn cỡ 50%. Lệnh thứ hai trỏ register cho npm về giao thức http thay cho https chạy chậm hơn.
      1. Duc

        5 years ago

        Phản hồi
        Thank Quang Tèo, thực hiện hai lệnh này thấy chạy cũng ổn hơn nhưng vẫn rất lâu, gây ức chế quá :((
    3. FirebirD

      5 years ago

      Phản hồi
      Nếu vẫn quá chậm chuyển qua dùng Yarn đi, Yarn đang dần thay thế NPM rồi đấy.
      1. Duc

        5 years ago

        Phản hồi
        Mình chuyển qua yarn thì khi chạy yarn install gặp lỗi này: yarn install v0.23.4 error An unexpected error occurred: "ENOENT: no such file or directory, open 'C: \\Users\\Admin\\AppData\\Local\\Yarn\\config\\global\\node_modules\\yarn\\node_m odules\\debug\\src\\index.js'". info If you think this is a bug, please open a bug report with the information p rovided in "c:\\Vue project\\adminLTE\\yarn-error.log". info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command. Nhọ đến thế là cùng, một ngày đen đủi, ức chế quá, thôi đi làm cốc bia xả stress đã, anh em nào giúp được tôi mời mấy vại bia nhé.

Thêm bình luận