Viết mô-đun NPM trong Typecript

Tôi đang làm việc trên mô-đun NPM đầu tiên của mình. Trước đây, tôi đã làm việc với bảng chữ và một vấn đề lớn là đối với nhiều mô-đun, không có sẵn tệp định nghĩa. Vì vậy, tôi nghĩ rằng sẽ là một ý tưởng hay nếu viết mô-đun của tôi trong bảng chữ.

Tuy nhiên, tôi không thể tìm thấy bất kỳ thông tin nào về cách tốt nhất để làm điều đó. Tôi đã tìm thấy câu hỏi liên quan này " Tôi có thể viết gói npm trong coffeescript không? ", Nơi mọi người đề xuất chỉ xuất bản các tệp javascript. Nhưng trái ngược với các tệp coffeescript, các tệp typecript có thể thực sự hữu ích nếu chúng được sử dụng trong ứng dụng sắp chữ.

Tôi có nên bao gồm các tệp Typecript khi xuất bản mô-đun NPM hay tôi chỉ nên xuất bản các tệp javascript và cung cấp các tệp .d.ts đã tạo cho chắc chắnTyped?

Đây là mô-đun Node mẫu được viết bằng TypeScript: https://github.com/basarat/ts-npm-module

Đây là một dự án TypeScript mẫu sử dụng mô-đun mẫu này https://github.com/basarat/ts-npm-module-consume

Về cơ bản bạn cần:

• biên dịch với commonjsvàdeclaration:true
• tạo một .d.tstập tin

Và sau đó

• Yêu cầu lý tưởng của bạn đọc được tạo ra .d.ts.

Atom-TypeScript chỉ cung cấp một quy trình làm việc tốt về vấn đề này: https://github.com/TypeStrong/atom-typescript#packagejson-support

Với TypeScript 3.x hoặc TypeScript 2.x, các bước sau mô tả những gì bạn phải làm để tạo một thư viện (gói npm) với TypeScript:

• Tạo dự án của bạn như bình thường (với các thử nghiệm và mọi thứ)
• Thêm declaration: truevào tsconfig.jsonđể tạo kiểu chữ.
• Xuất API thông qua một index.ts
• Trong phần package.json, hãy trỏ đến các kiểu chữ đã tạo của bạn. Ví dụ nếu bạn outDirlàdist , sau đó thêm "types": "dist/index.d.ts"vào gói json của bạn.
• Trong package.json, trỏ đến tệp mục nhập chính của bạn. Ví dụ: nếu outDirlà của bạn distvà tệp mục nhập chính là index.js, thì hãy thêm "main": "dist/index.js"vào package.json của bạn.
• Tạo một .npmignoređể bỏ qua các tệp không cần thiết (ví dụ: nguồn).
• Xuất bản lên npm với npm publish. Sử dụng thông số kỹ thuật của semver cho các bản cập nhật (bản vá / sửa lỗi npm version patch, bổ sung không vi phạm npm version minor, thay đổi api vi phạm npm version major)

Vì tôi đã phải mất một thời gian để sàng lọc tất cả các tài nguyên lỗi thời về chủ đề này trên internet (như tài nguyên trên trang này ...), tôi quyết định gói gọn nó trong thư viện how-to-write-a-typecript-library với một cập nhật ví dụ làm việc tối thiểu.

Đây là câu trả lời gần đây hơn bằng cách sử dụng TypeScript 1.8.10:

Cấu trúc dự án của tôi là:

|
|--- src
|--- test
|--- dist     <= My gulp file compiles and places the js, sourcemaps and .d.ts files here
|      |--- src
|      |--- test
|--- typings
.gitignore
.npmignore
gulpfile.js
package.json
README.md
tsconfig.json
tslint.json
typings.json

Tôi đã thêm những thứ sau vào .npmignoređể tránh bao gồm các tệp không liên quan và giữ mức tối thiểu để gói được nhập và hoạt động:

node_modules/
*.log
*.tgz

src/
test/
gulpfile.js
tsconfig.json
tslint.json
typings.json
typings
dist/test

Của tôi .gitignorecó:

typings

# ignore .js.map files
*.js.map
*.js
dist

Của tôi package.jsoncó:

"main": "dist/src/index.js",
"typings":  "dist/src/index.d.ts",

Bây giờ tôi chạy: npm pack

Tệp kết quả (khi được giải nén) có cấu trúc như sau:

|
|--- dist
|       |--- src
|              |
|              index.js
|              index.js.map
|              index.d.ts
|
package.json
README.md

Bây giờ tôi đi đến dự án nơi tôi muốn sử dụng nó làm thư viện và nhập: npm install ./project-1.0.0.tgz

Nó cài đặt thành công.

Bây giờ tôi tạo một tệp index.tstrong dự án của mình, nơi tôi vừa cài đặt npm import Project = require("project");

Đánh máy Project. cung cấp cho tôi các tùy chọn Intellisense, đó là điểm của toàn bộ bài tập này.

Hy vọng điều này sẽ giúp ai đó sử dụng các dự án TypeScript npm của họ làm thư viện nội bộ trong các dự án lớn hơn của họ.

PS: Tôi tin rằng phương pháp này biên soạn dự án module NPM có thể được sử dụng trong các dự án khác là gợi nhớ của .dlltrong.NET thế giới. Tôi cũng có thể tưởng tượng các dự án được tổ chức trong Giải pháp trong VS Code nơi mỗi dự án tạo ra một gói npm sau đó có thể được sử dụng trong một dự án khác trong giải pháp như một phần phụ thuộc.

Vì phải mất một khoảng thời gian kha khá để tôi tìm ra điều này, tôi đã đăng nó để phòng trường hợp ai đó bị mắc kẹt ở đây.

Tôi cũng đã đăng nó cho một lỗi đóng cửa tại: https://github.com/npm/npm/issues/11546

Ví dụ này đã được tải lên Github: vchatterji / tsc-seed

Bạn nên xuất bản các nguồn phiên bản gốc thay vì định nghĩa loại. Để package.jsonthuộc tính 'type' trỏ đến tệp * .ts.

*.d.ts rất tốt để chú thích các lib JS hiện có, nhưng với tư cách là người tiêu dùng, tôi muốn đọc mã sắp chữ hơn là chuyển đổi giữa các định nghĩa kiểu và mã JS được tạo ở mức thấp hơn.

Tôi chủ yếu làm theo gợi ý của Varun Chatterji

Tuy nhiên, tôi muốn hiển thị một ví dụ hoàn chỉnh với kiểm tra đơn vị và phạm vi mã và xuất bản nó vào npmvà nhập chúng bằng cách sử dụng javascripthoặctypescript

Mô-đun này được viết bằng cách sử dụng typescript 2.2và điều quan trọng là phải định cấu hình prepublishhook để biên dịch mã bằng cách sử dụng tsctrước khi xuất bản nó lên npm

https://github.com/sweetim/haversine-position

https://www.npmjs.com/package/haversine-position

Bạn cũng có thể sử dụng autodts để xử lý việc phân phối và sử dụng .d.tscác tệp từ npm mà không cần hỗ trợ từ Atom IDE.

autodts generatesẽ nhóm tất cả các .d.tstệp của riêng bạn lại với nhau để xuất bản trên npm và autodts linkxử lý các tham chiếu đến các gói đã cài đặt khác, có thể không phải lúc nào cũng nằm ngay node_modulestrong một dự án lớn hơn được chia thành nhiều gói con.

Cả hai lệnh đều đọc cài đặt của chúng từ package.jsonvà tsconfig.jsontheo kiểu "quy ước trên cấu hình".

Có một câu trả lời khác về stackoverflow và một bài đăng trên blog với nhiều chi tiết hơn.

Tại Lossless, chúng tôi đã tạo một công cụ phát triển TypeScript một cửa cho các gói npm: https://gitzone.gitlab.io/npmts/