在Typescript中编写NPM模块

时间:2015-06-19 00:52:16

标签: javascript node.js npm typescript

我正在开发我的第一个NPM模块。我以前简单地使用过typescript,一个很大的问题是,对于许多模块,没有可用的定义文件。所以我认为用打字稿写我的模块是个好主意。

但是,我找不到有关最佳方法的任何信息。我发现这个相关问题“Can I write npm package in coffeescript?”,人们建议只发布javascript文件。但与coffeescript文件相比,如果在打字稿应用程序中使用打字稿文件,那么打字稿文件实际上可能很有用。

发布NPM模块时是否应该包含Typescript文件,还是应该只发布javascript文件并将生成的.d.ts文件提供给DefinitelyTyped?

7 个答案:

答案 0 :(得分:78)

以下是使用TypeScript编写的示例Node模块:https://github.com/basarat/ts-npm-module

以下是使用此示例模块https://github.com/basarat/ts-npm-module-consume

的示例TypeScript项目

基本上你需要:

  • 使用commonjsdeclaration:true
  • 进行编译
  • 生成.d.ts文件

然后

  • 让您的ide读取生成的.d.ts

Atom-TypeScript只是提供了一个很好的工作流程:https://github.com/TypeStrong/atom-typescript#packagejson-support

答案 1 :(得分:63)

2018年推荐使用Typescript 2.x:

  • 像往常一样创建项目(使用测试和所有内容)
  • declaration: true添加到tsconfig.json以生成输入法。
  • 通过index.ts
  • 导出API
  • package.json中,指向您生成的输入内容。例如,如果您的outDirdist,则将"types": "dist/index.d.ts"添加到您的包json。
  • package.json中,指向您的主条目文件。例如,如果您的outDirdist且主条目文件为index.js,则将"main": "dist/index.js"添加到您的package.json。
  • 创建.npmignore以忽略不必要的文件(例如来源)。
  • 使用npm publish发布到npm。使用semver规范进行更新(修补程序/错误修复npm version patch,不间断添加npm version minor,打破api更改npm version major

因为它让我花了一些时间在互联网上筛选关于这个主题的所有过时资源(就像本页上的那个......)我决定将它包含在how-to-write-a-typescript-library中 - 工作最小示例。

答案 2 :(得分:57)

这是使用TypeScript 1.8.10的最新答案:

我的项目结构是:

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

我在.npmignore中添加了以下内容,以避免包含无关文件,并保持最低限度以便导入并运行包:

node_modules/
*.log
*.tgz

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

我的.gitignore有:

typings

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

我的package.json有:

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

现在我跑: npm pack

结果文件(解压缩时)具有以下结构:

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

现在我转到我想将其用作库并输入的项目: npm install ./project-1.0.0.tgz

成功安装。

现在我在我刚刚安装了npm的项目中创建了一个文件index.ts import Project = require("project");

键入Project.为我提供了Intellisense选项,这是整个练习的重点。

希望这可以帮助其他人在他们更大的项目中使用他们的TypeScript npm项目作为内部库。

PS:我认为这种将项目编译为npm模块的方法可以在其他项目中使用,这让人联想到.dll世界中的.NET。我可以想象在VS Code中的解决方案中组织项目,其中每个项目都生成一个npm包,然后可以在解决方案中的另一个项目中用作依赖项。

由于我花了相当多的时间来解决这个问题,所以我发布了以防万一有人被困在这里。

我还发布了一个已关闭的bug: https://github.com/npm/npm/issues/11546

此示例已上传到Github:vchatterji/tsc-seed

答案 3 :(得分:5)

您应该发布原始的打字稿来源而不是类型定义。在package.json中,请使用&#39;类型&#39; property指向* .ts文件。

*.d.ts可以为现有的JS库添加注释,但作为消费者,我宁愿阅读打字稿代码,也不要在类型定义和下层生成的JS代码之间切换。

答案 4 :(得分:5)

我主要遵循Varun Chatterji

的建议

但是,我想展示单元测试和代码覆盖率的完整示例,并将其发布到npm并使用javascripttypescript

导入它们

此模块使用typescript 2.2编写,配置prepublish挂钩以使用tsc编译代码然后将其发布到npm

非常重要

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

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

答案 5 :(得分:4)

您可以使用autodts来处理从npm分发和使用.d.ts文件,而无需Atom IDE的支持。

autodts generate会将您自己的.d.ts个文件捆绑在一起,以便在npm上发布,而autodts link会处理对其他已安装软件包的引用,这些软件包可能并不总是直接位于node_modules下在一个较大的项目中分成几个子包。

两个命令都从package.jsontsconfig.json中读取设置&#34;约定优于配置&#34;风格。

有关于stackoverflow的another answer和有blog post的详细信息。

答案 6 :(得分:1)

在Lossless,我们为npm包创建了一站式TypeScript开发工具:https://gitzone.gitlab.io/npmts/