Mẹo và thủ thuật để làm việc với NPM
Bài đăng này đã không được cập nhật trong 4 năm
NPM, Node Package Manager, là trình quản lý gói cho ngôn ngữ lập trình JavaScript. Bất kỳ nhà phát triển nào đang làm việc với Javascript đều đã sử dụng công cụ CLI tuyệt vời này để cài đặt các dependencies cho dự án của họ.
Trong bài viết này, tôi sẽ chia sẻ các mẹo và thủ thuật với NPM có thể tăng năng suất của bạn và cho phép bạn sử dụng NPM một cách thông minh và hiệu quả hơn.
1. Initialize your package
Chúng ta có thể chạy lệnh npm init để khởi tạo gói của mình nhưng nó sẽ hỏi thông tin về gói, tác giả, v.v. Có một cách khác để tự động tạo package.json bằng lệnh npm init -y.
npm init -y
Chúng ta cũng có thể thiết lập một số cấu hình init mặc định như chi tiết về tác giả, v.v. Hãy cấu hình bằng cách sử dụng lệnh npm config.
npm config set init-author-name "Bilaka Jain"
npm config set init-author-email "bilakajain@gmail.com"
Và hãy chạy lệnh npm init -y để khởi tạo package
{
"name": "<name of the root dir>",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "Bilaka Jain <bilakajain@gmail.com>",
"license": "ISC"
}
Chúng ta cũng có thể mở rộng chức năng của npm init bằng cách thêm tệp javascript tùy chỉnh của riêng mình và cấu hình lại bằng npm config
npm config set init-module <path-of-the-custom-file>
2. Install a package from other sources
NPM CLI cũng cho phép cài đặt các gói javascript từ các nguồn khác như Bit, repo GitHub, Bitbucket và gist.
# Install a component from Bit (set Bit as a scoped registry)
npm config set @bit:registry https://node.bit.dev
npm i @bit/username.collection.component
# Install from tarball stored locally
npm i ./local-tarball-package.tgz
# Install tarball package from internet
npm i https://abc/xyz/package.tar.gz
# Install from github repo
npm i githubuser/reponame
# Install from bitbucket repo
npm i bitbucket:bitbucketuser/reponame
# Install from gist
npm i gist:gistID
Ví dụ: Cài đặt Button component từ Bit
Tôi đang tìm kiếm một Button component mà một trong những đồng nghiệp của tôi đã xuất bản cho bộ sưu tập thành phần của chúng tôi trên Bit.
Tôi sẽ bắt đầu bằng cách chỉ định cấu hình Bit dưới dạng scoped registry:
npm config set @bit:registry https://node.bit.dev
Sau đó, tôi sẽ đi đến bộ sưu tập của team tôi để tìm button:
Sau đó vào Button component và copy câu lệnh:
npm i @bit/the_a-team.imperfect-components.button
3. Clean install your package dependencies
Chúng ta có thể chạy npm ci để cài đặt các gói phụ thuộc. Nó thường được sử dụng trong các môi trường tự động như nền tảng CI / CD
npm ci
Nó khác với npm install :
- Nó cài đặt phiên bản chính xác của gói được đề cập trong tệp package-lock.json.
- Loại bỏ node_modules hiện có và chạy cài đặt mới.
- Nó sẽ không viết vào package.json và lock file.
- Nó không cài đặt các gói riêng lẻ tương tự như
npm install.
4. Use shortcuts to install packages
Đây là tính năng hữu ích mà chúng ta có thể sử dụng để tiết kiệm thời gian trong khi cài đặt các gói
# Install package
npm install <package_name>
Shortcut: npm i <package_name>
# Install devDependencies
npm install --save-dev <package_name>
Shortcut: npm i -D <package_name>
# Install dependencies (This is default)
npm install --save-prod <package_name>
Shortcut: npm i -P <package_name>
# Install packages globally
npm install --global <package_name>
Shortcut: npm i -g <package_name>
Cài đặt nhiều gói trong một lệnh
npm i express cheerio axios
Cài đặt nhiều gói có cùng tiền tố
npm i eslint-{plugin-import,plugin-react,loader} express
5. NPM scripts
NPM scripts là tính năng hữu ích nhất. Nó hỗ trợ các tập lệnh tùy chỉnh pre-defined pre/post hooks (thường được gọi là tập lệnh vòng đời) như:
preinstall - chạy trước khi bất kỳ gói nào được cài đặt.
npm run env liệt kê tất cả các biến môi trường npm có trong gói của chúng ta. Nó cũng chứa các thuộc tính gói có tiền tố npm_package_.
npm run env
Output giống vậy
npm_config_save_dev=
npm_config_legacy_bundling=
npm_config_dry_run=
npm_config_viewer=man
.
.
npm_package_license=ISC # Package properties
npm_package_author_name=Ankit Jain
npm_package_name=npm-tips-and-tricks # Name of our package
Chúng ta cũng có thể truy cập các biến env ở trên trong code của mình bằng process.env.npm_package_name và các biến khác tương tự
Tự đặt các biến riêng trong package.json
Chúng ta có thể chuyển các biến của riêng mình dưới dạng các biến môi trường npm với tiền tố npm_package_config_ bằng cách xác định chúng trong tệp package.json, trong đối tượng config. Tạo 1 biến myvariable sẽ như sau:
"config": {
"myvariable": "Hello World"
},
Bây giờ, thì hãy check biến env
npm run env | grep npm_package_config_
Kết quả
npm_package_config_myvariable=Hello World
Define các custom scripts
Lệnh npm run hiển thị tất cả các tập lệnh mà chúng ta đã xác định trong tệp package.json. Hãy thêm một số tập lệnh tùy chỉnh vào package.json của chúng ta
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node index.js",
"echo-hello": "echo \"Hello\"",
"echo-helloworld": "echo \"Helloworld\"",
"echo-both": "npm run echo-hello && npm run echo-helloworld",
"echo-both-in-parallel": "npm run echo-hello & npm run echo-helloworld",
"echo-packagename": "echo $npm_package_name",
"echo-myvariable": "echo $npm_package_config_myvariable",
"echo-passargument": "npm run echo-packagename -- \"hello\"",
"echo-pipedata": "cat ./package.json | jq .name > package-name.txt"
},
Bây giờ, chúng ta có thể thấy tất cả các lệnh được thêm ở trên bằng cách chạy lệnh này
npm run
Output
# npm-tips-and-tricks (name of our package)
Lifecycle scripts included in npm-tips-and-tricks:
test
echo "Error: no test specified" && exit 1
start
node index.js
available via `npm run-script`:
echo-hello
echo "Hello"
echo-helloworld
echo "Helloworld"
echo-both
npm run echo-hello && npm run echo-helloworld
echo-both-in-parallel
npm run echo-hello & npm run echo-helloworld
echo-packagename
echo $npm_package_name
echo-myvariable
echo $npm_package_config_myvariable
echo-passargument
npm run echo-packagename -- "hello"
echo-pipedata
cat ./package.json | jq .name > package-name.txt
Chạy 1 đoạn script đơn gian
npm run echo-hello
# Output
> echo "Hello"
Hello
Chạy multiple scripts trong 1 single npm script
Chúng ta có thể chạy nhiều câu lệnh bằng cách sử dụng &&.
npm run echo-both
# Output
> npm run echo-hello && npm run echo-helloworld
> npm-tips-and-tricks@1.0.0 echo-hello
> echo "Hello"
Hello
> npm-tips-and-tricks@1.0.0 echo-helloworld
> echo "Helloworld"
Helloworld
Chúng ta cũng có thể chạy song song nhiều tập lệnh bằng cách sử dụng &
npm run echo-both-in-parallel
# Output
> npm run echo-hello & npm run echo-helloworld
> npm-tips-and-tricks@1.0.0 echo-hello
> echo "Hello"
> npm-tips-and-tricks@1.0.0 echo-helloworld
> echo "Helloworld"
Hello
Helloworld
Sử dụng biến môi trường npm trong tập lệnh npm
npm run echo-packagename
# Output
> echo $npm_package_name
npm-tips-and-tricks
-------------
npm run echo-myvariable
# Output
> echo $npm_package_config_myvariable
Hello World
Truyền đối số cho tập lệnh npm
Chúng ta có thể sử dụng -- để truyền đối số cho tập lệnh npm. Trong ví dụ dưới đây, chúng ta truyền hello như một đối số cho tập lệnh echo-packagename
npm run echo-passargument
# Output
> npm run echo-packagename -- "hello"
> npm-tips-and-tricks@1.0.0 echo-packagename
> echo $npm_package_name "hello"
npm-tips-and-tricks hello
Sử dụng Pipe để truyền dữ liệu từ tập lệnh npm này sang tập lệnh khác
npm run echo-pipedata
# Output
> cat ./package.json | jq .name > package-name.txt
# Let's cat package-name.txt
cat package-name.txt
# Output
"npm-tips-and-tricks"
6. Quickly navigate to package docs
Chúng ta có thể nhanh chóng điều hướng đến tài liệu của bất kỳ gói npm nào bằng cách chạy lệnh này
npm docs <package-name>
OR
npm home <package-name>
Nếu chúng ta muốn kiểm tra các issue hoặc gửi bất kỳ lỗi nào trong gói npm, chúng ta cũng có thể điều hướng đến trang web bằng cách chạy lệnh này
npm bug <package-name>
Tương tự, npm repo <package-name> mở trang repo GitHub trong trình duyệt
7. Removes duplicate packages
Chúng ta có thể loại bỏ các dependencies trùng lặp bằng cách chạy lệnh npm depupe. Nó đơn giản hóa cấu trúc tổng thể bằng cách loại bỏ các gói trùng lặp và chia sẻ hiệu quả sự phụ thuộc chung trên nhiều gói phụ thuộc. Nó dẫn đến một cây phẳng và không trùng lặp
npm dedupe hoặc npm ddp
8. Scan your application for vulnerabilities
Chúng ta có thể chạy lệnh npm audit để quét dự án của chúng ta xem có lỗ hổng nào trong bất kỳ dependency. Nó tạo ra một đầu ra đẹp mắt ở định dạng bảng (chúng ta cũng có thể nhận đầu ra dạng JSON) , với các gói khác phụ thuộc vào gói này nếu đó là multi-level/multi dependency.
npm audit fix tự động cài đặt phiên bản vá (nếu có) của tất cả các gói dễ bị tấn công
npm audit fix
9. Check our environment
Chúng ta có thể sử dụng lệnh npm doctor để chạy nhiều kiểm tra trên môi trường của chúng ta, check xem npm CLI của chúng ta có đủ quyền để cài đặt các gói javascript hay không và nó có thể kết nối với sổ đăng ký npm hay không. Nó cũng kiểm tra các phiên bản node và npm, xác nhận bộ đệm cho bất kỳ gói bị hỏng nào.
npm doctor
10. Check outdated packages
Chúng ta có thể sử dụng lệnh npm outdated để kiểm tra tất cả các gói npm đã lỗi thời. Nó cũng hiển thị phiên bản mới nhất sẽ được cài đặt cho bất kỳ gói lỗi thời nào.
npm outdated --long or npm outdated -l
Chúng ta cũng có thể kiểm tra phiên bản mới nhất cho bất kỳ gói npm nào bằng cách chạy lệnh này
# Shows the package information
npm view <package-name> or npm v <package-name>
# Shows the latest version only
npm v <package-name> version
# Shows the list of all versions
npm v <package-name> versions
11.List all the installed packages
Chúng ta có thể liệt kê tất cả các gói npm được cài đặt trong dự án của chúng ta chỉ bằng cách chạy lệnh npm list. Nó sẽ tạo ra một cấu trúc cây hiển thị gói đã cài đặt và các phụ thuộc của nó
npm list or npm ls
Chúng ta có thể dùng thêm tùy chọn --depth để giới hạn độ sâu
npm ls --depth=1
Trong bài viết này, tôi đã chia sẻ về một số mẹo và thủ thuật NPM hữu ích mà chúng ta có thể sử dụng để tăng năng suất. Có thể có rất nhiều thủ thuật / mẹo như vậy. Tôi rất thích nghe về chúng trong phần bình luận
Nguồn https://blog.bitsrc.io/
All rights reserved
