NPM đại cương - Tôi đã đẩy package lên npm như thế nào?

NPM đại cương - Tôi đã đẩy package lên npm như thế nào?

Bài viết trong chủ đề này:
  1. NPM đại cương - Tôi đã đẩy package lên npm như thế nào?
  2. NPM đại cương - Xây dựng và đẩy package lên npm
Tin ngắn hàng ngày dành cho bạn
  • Manus đã chính thức mở cửa cho tất cả người dùng rồi đấy mọi người. Cho những ai chưa biết thì đây là một công cụ viết báo cáo (làm mưa làm gió) giống như Deep Research của OpenAI á. Mỗi ngày được miễn phí 300 Credits để nghiên cứu. Mỗi lượt nghiên cứu tiêu tốn tuỳ thuộc vào độ phức tạp của yêu cầu. À với cả họ đang có chương trình tặng miễn phí Credits hay sao á. Như mình thì vào thấy được hẳn 2000.

    Mình dùng thử, so sánh với cùng một lệnh giống như đợt trước dùng bên Deep Research thì nội dung khác biệt nhau hoàn toàn. Manus báo cáo như kiểu viết văn hơn so với OpenAI là các gạch đầu dòng và bảng biểu.

    À lúc đăng ký xong có bắt nhập số điện thoại để xác minh, nếu lỗi thì các bạn đợi qua ngày thử lại xem có được không nhé.

    » Xem thêm
  • Mọi người chắc nghe nhiều về xu hướng tìm kiếm thông tin bằng AI chứ không cần công cụ tìm kiếm như Google nữa rồi đúng không? Không đâu xa ánh xạ vào bản thân thì thấy đúng thật, thi thoảng mới tìm kiếm thôi chứ còn đâu toàn hỏi tụi AI.

    Ngay từ đầu viết blog, thứ mà mình hướng đến là chia sẻ kinh nghiệm chứ không phải là những bài mang nặng tính kỹ thuật, máy móc, hướng dẫn từ đầu... Vì thời điểm đó đã có quá nhiều người làm nội dung này rồi và họ làm rất tốt, tại sao mình phải cố phát minh lại bánh xe? Một điều nữa là tin tưởng độc giả của mình có khả năng tìm hiểu vấn đề. Nếu bạn đọc đủ nhiều các bài viết trên blog thì thấy mình luôn cố gắng chèn thêm các liên kết tham khảo ngoài bài viết, nêu ra vấn đề mở và rất ít khi kết luận chắc chắn một điều gì đó.

    Mình đã cố gắng rèn luyện kỹ năng viết, kỹ năng trình bày và cả cách tương tác với độc giả để mang lại giá trị cho họ. Nhiều lúc ngồi lật lại các con số thống kê thấy lượng đọc bài viết tăng lên lại cảm thấy vui. Nhưng khi nguồn truy cập đến từ Google thì lại thấy buồn, vì điều đó chứng tỏ họ biết đến mình chỉ khi đang cố đi tìm giải pháp, có thể họ chỉ đọc chớp nhoáng, may ra tìm được cách giải quyết và thế là đóng cửa sổ trình duyệt rồi đi như một cơn gió.

    Chừng vài tháng đổ lại đây, một điều khiến mình rất vui đó là lượng người truy cập thẳng vào trang chủ mà không thông qua công cụ tìm kiếm đang tăng dần lên, có nhiều hôm lượng truy cập tự nhiên còn cao hơn cả đến từ Google. Điều đó chứng tỏ độc giả đã có thói quen quay lại trang của mình nhiều hơn và họ tìm thấy được giá trị từ blog mang lại. Vui mừng khôn xiết 🤩

    Bên cạnh đó thì lượng truy cập vào chuyên mục Threads - tức là mục mình đang viết bài này đang cao hơn bao giờ hết. Điều đó chứng tỏ xu hướng đi theo tin nhanh là đúng đắn. Mình có thể ngồi cả ngày để viết tin ngắn cho bạn đọc vì nó rất nhanh mà tiện, không tốn công đi tìm tài liệu để viết, không tốn cả thời gian viết nữa, còn mình thì có rất nhiều thứ để chia sẻ 😅. Nhưng không vì thế mà bỏ bê các bài viết dài, vì dài thì có nhiều thông tin để chia sẻ hơn.

    Vài lời tâm sự thế thôi chứ hơn một tháng nay mình chưa viết bài viết mới nào vì công việc bận quá. Xong lâu dần cứ trì hoãn lại thành lười. À với cả tháng 5 này rất thích hợp để đọc các cuốn sách về cách mạng á. Có hôm đọc đến 2 giờ sáng mới đi ngủ 🥱

    » Xem thêm
  • Mình mới nhìn thấy một trang web khá thú vị nói về các cột mốc đáng nhớ trong lịch sử phát triển Internet toàn cầu: Internet Artifacts

    Chỉ từ 1977 - khi Internet còn nằm trong hộp thí nghiệm thì nhìn xem - giờ đây Internet đã khiến mọi thứ phát triển đến mức nào 🫣

    » Xem thêm

Vấn đề

Chắc hẳn mọi người ở đây ai cũng từng nghe, biết và sử dụng npm hằng ngày trong công việc. NPM là một kho lưu trữ packages khổng lồ mà chủ yếu là các thư viện javascript dùng cho lập trình web hay node.js.

Bản thân NPM chỉ là kho vậy thì các package từ đâu ra? Câu trả lời là từ cộng đồng, trong đó có thể có chính các bạn - những người hẳn đang có những ý tưởng thú vị và sẵn sàng chia sẻ.

Bản thân tôi sau rất nhiều lần dùng "chùa" các packages thì một biến cố lớn xảy đến, đó là tôi không thể tìm được một component nào nhập mã OTP cho vue.js cả (tại thời điểm lúc đó, còn bây giờ thì tôi cũng không rõ lắm :D). Thế là tôi đành phải tự viết, nhưng khoan thay vì dùng một mình thì tại sao tôi không đóng gói nó và chia sẻ lên mạng nhỉ? Lúc đó điều tôi nghĩ ngay đến là mạng "phân phối nội dung" NPM thần thánh.

Ý tưởng đến để xây dựng một package luôn xuất hiện ở mọi nơi, mặc dù bây giờ có hàng chục hoặc thậm chí hàng trăm package khác nhau nhưng cùng giải quyết cùng một vấn đề. Cạnh tranh với các package lâu đời có lượt download khổng lồ là khó. Tuy nhiên đóng góp một phần nhỏ bé cũng là đóng góp phải không mọi người? Điều bạn cần là tạo một package có độ tin cậy cao, phát hành đúng thời điểm cộng một chút may mắn.

Lựa chọn nền tảng cho packages

Các packages trên npm rất đa dạng, ví dụ có những package chỉ dành cho browser hoặc chỉ dành cho node.js, hay có cả những package hỗ trợ cả hai. Ngoài ra một package viết cho vue.js thì react.js không thể nào dùng được v.v...& v.v..

Vì thế ngay từ đầu bạn nên xác định sẽ viết package sử dụng cho nền tảng nào. Ví như như tôi đã chọn "package OTP INPUT cho vue.js".
Việc xây dựng một package sẽ dễ dàng hơn nếu như bạn tìm được "khung" phù hợp. Khung ở đây là một project được setup sẵn mọi thứ từ run build, run dev, run test... tất tần tật, việc của bạn chỉ là tập trung vào xử lý logic.
Hoặc nếu không tìm thấy hay không muốn dùng sẵn thì bạn có thể lựa chọn xây dựng từ đầu, đồng nghĩa với việc bạn phải setup tất cả mọi thứ. Dĩ nhiên là có thể lược bớt các thành phần như run dev, run test... nhưng như thế sẽ khiến package của bạn thiếu đi sự "chuyên nghiệp".

Một số khung phổ biết mà tôi biết:

Sau khi đã hoàn thành logic cho package, tôi sẽ cần phải tạo một file README.md trong đó mô tả cách sử dụng, các attributes v.v... đủ để cho mọi người hiểu. Ngoài ra còn chỉ cho họ cách để chạy dev, test... khi họ muốn contribute.
Bước cuối cùng là bước publish package lên npm.

Làm quen npm cli

CLI của npm giúp sẽ giúp tôi đẩy package lên repository. Mặc định khi cài node.js là sẽ có npm, vì thế ai chưa có thì cài node.js nhé!

Kiểm tra phiên bản npm:

$ npm -v
6.14.12

Đăng nhập vào npm:

$ npm login

Di chuyển đến thư mục chứa project cần publish, ví dụ ở đây tôi move đến thư mục vue-otp-2:

$ cd vue-otp-2

Đảm bảo rằng trong thư mục đó đã có file package.json. NPM sẽ dựa vào package.json để publish package của bạn, một file package.json cơ bản phải có name & version:

{
  "name": "vue-otp-2",  
  "version": "1.0.0",  
}

Trong đó name là tên package được dùng để install npm i vue-otp-2 còn version là phiên bản của package tại thời điểm publish.

Sau đó publish:

$ npm publish

Ngồi chờ cho đến khi publish thành công và bạn sẽ nhận được một email thông báo về việc này.

Một số lưu ý khi publish:

  • Hãy đảm bảo version package của bạn theo chuẩn semantic. Nếu chưa biết có thể xem thêm ở đây.

  • Hãy đảm bảo tên version của bạn là unique trên npm. Ví dụ bạn không thể đặt tên package là vue-opt-2 nữa đơn giản là tôi đã sở hữu cái tên đó rồi, còn nếu bạn vẫn muốn dùng cái tên đó thì npm cung cấp thêm một lựa chọn tên package nữa đại loại sẽ gắn thêm username của bạn vào tên: @hoaitx:vue-opt-2. Tham khảo cách thiết lập tại đây.

  • Ngoài name & version thì còn rất nhiều thông số thú vị để khiến cho profile package của bạn trông "ngầu" hơn. Tham khảo thêm tại đây.

Tips & tricks:

  • Một vài bạn publish thành công rồi nhưng lúc install vào project thì không sử dụng được thì rất có thể là chưa xác định đúng điểm nhập module trong package. Cụ thể package.json có một thuộc tính là main được dùng để xác định file nào sẽ được import vào khi gọi require/import mặc định là index.js. Ví dụ package có name là foo, khi gọi require("foo") thì nó tương ứng với đường dẫn là node_modules/foo/index.js.

  • Try on RunKit là một ứng dụng cho phép chúng ta dùng thử package trước khi quyết định có nên cài đặt hay không :D.

Tổng kết

Ở bài viết này tôi chỉ dừng lại ở mức tường thuật lại quá trình publish package của tôi lên npm. Ở bài viết sau tôi sẽ đi vào chi tiết từng bước tạo package.

À cho bạn nào thắc mắc từ đầu bài đến giờ chưa thấy link đến package của tôi thì nó đây https://www.npmjs.com/package/vue-otp-2.

Cao cấp
Hello

5 bài học sâu sắc

Mỗi sản phẩm đi kèm với những câu chuyện. Thành công của người khác là nguồn cảm hứng cho nhiều người theo sau. 5 bài học rút ra được đã thay đổi con người tôi mãi mãi. Còn bạn? Hãy bấm vào ngay!

Mỗi sản phẩm đi kèm với những câu chuyện. Thành công của người khác là nguồn cảm hứng cho nhiều người theo sau. 5 bài học rút ra được đã thay đổi con người tôi mãi mãi. Còn bạn? Hãy bấm vào ngay!

Xem tất cả

Đăng ký nhận thông báo bài viết mới

hoặc
* Bản tin tổng hợp được gửi mỗi 1-2 tuần, huỷ bất cứ lúc nào.

Bình luận (0)

Nội dung bình luận...