Menulis modul NPM dalam Skrip Ketik

Saya sedang mengerjakan modul NPM pertama saya. Saya pernah bekerja dengan skrip jenis sebelumnya dan masalah besar adalah bahwa untuk banyak modul tidak ada file definisi yang tersedia. Jadi saya pikir akan menjadi ide yang bagus untuk menulis modul saya dalam skrip ketikan.

Namun, saya tidak dapat menemukan informasi apa pun tentang cara terbaik untuk melakukannya. Saya menemukan pertanyaan terkait " Bisakah saya menulis paket npm di coffeescript? " Di mana orang menyarankan hanya menerbitkan file javascript. Tetapi berbeda dengan file coffeescript, file skrip mungkin sebenarnya berguna jika digunakan dalam aplikasi skrip ketikan.

Apakah saya harus menyertakan file Ketik saat menerbitkan modul NPM, atau haruskah saya hanya menerbitkan file javascript dan memberikan file .d.ts yang dihasilkan ke DefinitelyTyped?

Berikut adalah contoh modul Node yang ditulis dalam TypeScript: https://github.com/basarat/ts-npm-module

Berikut adalah contoh proyek TypeScript yang menggunakan modul contoh ini https://github.com/basarat/ts-npm-module-consume

Pada dasarnya Anda perlu:

• kompilasi dengan commonjsdandeclaration:true
• menghasilkan .d.tsfile

Lalu

• Minta ide Anda terbaca .d.ts.

Atom-TypeScript hanya menyediakan alur kerja yang bagus di sekitar ini: https://github.com/TypeStrong/atom-typescript#packagejson-support

Dengan TypeScript 3.x atau TypeScript 2.x, langkah-langkah berikut menjelaskan apa yang harus Anda lakukan untuk membuat perpustakaan (paket npm) dengan TypeScript:

• Buat proyek Anda seperti biasa (dengan tes dan segalanya)
• Tambahkan declaration: trueke tsconfig.jsonuntuk menghasilkan pengetikan.
• Ekspor API melalui index.ts
• Di package.json, arahkan ke ketikan yang Anda buat. Misalnya jika Anda outDiradalah dist, maka tambahkan "types": "dist/index.d.ts"ke paket Anda json.
• Di package.json, arahkan ke file entri utama Anda. Misalnya jika Anda outDiradalah distdan file entri utama adalah index.js, maka tambahkan "main": "dist/index.js"ke package.json Anda.
• Buat .npmignoreuntuk mengabaikan file yang tidak perlu (misalnya sumber).
• Publikasikan ke npm dengan npm publish. Gunakan spesifikasi semver untuk update (perbaikan patch / bug npm version patch, tambahan yang tidak melanggar npm version minor, perubahan api yang melanggar npm version major)

Karena itu memberi saya waktu untuk menyaring semua sumber yang sudah ketinggalan zaman tentang topik ini di internet (seperti yang ada di halaman ini ...) saya memutuskan untuk membungkusnya di pustaka how-to-write-a-typescript dengan contoh kerja minimal yang up-to-date.

Ini adalah jawaban yang lebih baru menggunakan TypeScript 1.8.10:

Struktur proyek saya adalah:

|
|--- 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

Saya menambahkan yang berikut ini .npmignoreuntuk menghindari menyertakan file asing dan menjaga minimum agar paket diimpor dan berfungsi:

node_modules/
*.log
*.tgz

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

Saya .gitignorememiliki:

typings

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

Saya package.jsonmemiliki:

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

Sekarang saya menjalankan: npm pack

File yang dihasilkan (saat diekstrak) memiliki struktur berikut:

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

Sekarang saya pergi ke proyek di mana saya ingin menggunakan ini sebagai perpustakaan dan mengetik: npm install ./project-1.0.0.tgz

Ini berhasil menginstal.

Sekarang saya membuat file index.tsdi proyek saya di mana saya baru saja menginstal npm import Project = require("project");

Mengetik Project.memberi saya opsi Intellisense yang merupakan inti dari keseluruhan latihan ini.

Semoga ini membantu orang lain dalam menggunakan proyek npm TypeScript mereka sebagai perpustakaan internal dalam proyek mereka yang lebih besar.

PS: Saya percaya bahwa pendekatan proyek kompilasi ke modul npm yang dapat digunakan dalam proyek lain ini mengingatkan pada .dlldi .NETdunia. Saya bisa membayangkan proyek-proyek yang diatur dalam Solusi dalam VS Code di mana setiap proyek menghasilkan paket npm yang kemudian dapat digunakan dalam proyek lain dalam solusi sebagai ketergantungan.

Karena butuh waktu yang cukup lama bagi saya untuk mencari tahu, saya telah mempostingnya jika ada orang yang terjebak di sini.

Saya juga mempostingnya untuk bug tertutup di: https://github.com/npm/npm/issues/11546

Contoh ini telah diunggah ke Github: vchatterji / tsc-seed

Anda harus menerbitkan sumber skrip ketikan asli, bukan definisi tipe. Dalam package.jsonmembiarkan titik properti 'jenis' untuk file * ts.

*.d.ts bagus untuk membuat anotasi JS libs yang ada, tetapi sebagai konsumen, saya lebih suka membaca kode skrip daripada beralih di antara definisi tipe dan kode JS yang dihasilkan ke bawah.

Saya terutama mengikuti saran oleh Varun Chatterji

Tapi, saya ingin menunjukkan contoh lengkap dengan pengujian unit dan cakupan kode dan menerbitkannya ke npmdan mengimpornya menggunakan javascriptatautypescript

Modul ini ditulis menggunakan typescript 2.2dan penting untuk mengkonfigurasi prepublishhook untuk mengkompilasi kode menggunakantsc sebelum mempublikasikannya ke npm

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

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

Anda dapat menggunakan autodts untuk menangani pendistribusian dan penggunaan.d.ts file dari npm juga tanpa dukungan dari Atom IDE.

autodts generateakan memaketkan semua .d.tsfile Anda sendiri untuk dipublikasikan di npm, dan autodts linkmenangani referensi ke paket terinstal lainnya, yang mungkin tidak selalu berada langsung node_modulesdi bawah dalam proyek yang lebih besar yang dibagi menjadi beberapa sub-paket.

Kedua perintah membaca pengaturannya dari package.jsondan tsconfig.jsondalam gaya "konvensi atas konfigurasi".

Ada jawaban lain tentang stackoverflow dan entri blog dengan detail lebih lanjut.

Di Lossless kami membuat alat dev TypeScript satu atap untuk paket npm: https://gitzone.gitlab.io/npmts/