Typescript 如何使用通用工具构造NPM包

Typescript 如何使用通用工具构造NPM包,typescript,npm,structure,tsdx,Typescript,Npm,Structure,Tsdx,我需要为我们公司的各种前端项目使用的一些常见功能制作一个NPM包,但非常不确定如何正确执行。我们使用的是Typescript,似乎处理了一些我不确定如何正确处理的事情,但它没有说明如何构造“实用程序”类型的包 我不明白的是,package.json中应该指向什么,当包中没有逻辑上的单个导出/类/函数时 它应该只导出整个包中的每个“公共”函数吗?如果是这样的话,这将如何影响树的晃动(我目前还不太了解)和类似的事情 如果不应该,那么“main”应该指向什么,以及如何导出和导入东西?例如,我希望能够从

我需要为我们公司的各种前端项目使用的一些常见功能制作一个NPM包,但非常不确定如何正确执行。我们使用的是Typescript,似乎处理了一些我不确定如何正确处理的事情,但它没有说明如何构造“实用程序”类型的包

我不明白的是,
package.json
中应该指向什么,当包中没有逻辑上的单个导出/类/函数时

它应该只导出整个包中的每个“公共”函数吗?如果是这样的话,这将如何影响树的晃动(我目前还不太了解)和类似的事情

如果不应该,那么
“main”
应该指向什么,以及如何导出和导入东西?例如,我希望能够
从'@org/common/category/foobar
导入foobar,但按照npm创建包的方式,包路径似乎通常会包括
dist
lib
或类似的内容,这是我真正不想要的

如何构建一个“多功能NPM包”,以获得干净的导入和工作树震动以及其他好处?

有没有人在GitHub或其他可用的地方有这样的库的好的、干净的、简单的例子?我曾经尝试过像lodash这样的项目,但它们通常不是由Typescript编写的,而且通常似乎有相当复杂的设置,包括mono repos、工作区、自定义构建脚本等等

一个人应该如何构建一个“多功能NPM包”,以获得干净的进口和工作树震动和其他好东西

发布现代es模块 对于现代库(节点和浏览器),应使用typescript编写源代码,并提供es模块分发版

这个策略遵循的理念是,新的库应该是现代的、精简的和最低限度的——您的库应该是一个公开的es模块目录

您的package.json应该包括

"type": "module",
"main": "dist/main.js",
"module": "dist/main.js",
"files": [
  "dist",
  "source"
],
"scripts": {
  "prepare": "tsc",
  "watch": "tsc -w",
},
"devDependencies": {
  "typescript": "typescript": "^3.8.3"
},
也许您的tsconfig.json中包含以下条目

"baseUrl": ".",
"rootDir": "source",
"outDir": "dist",
"target": "esnext",
"lib": ["esnext", "dom"],
"module": "esnext",
"experimentalDecorators": true,
"sourceMap": true,
"declaration": true,
所有优化问题——即:捆绑、缩小、树抖动、透明、多边形填充等——所有这些问题都已经由使用者应用程序处理(如果库提供了这些问题,则会导致冗余膨胀)

遗留的通用js应用程序可以轻松使用esm适配器来使用es模块分发版

如果您绝对必须(请另行考虑),可以使您的双ESM+CJS混合软件包:只运行一个并行的构建步骤<代码> TSC——模块= Outjj-Outdir DIST CJS,然后设置PACKAG.JSON <代码>“main”:“DIST CJS/Maul.js”,,同时可以支持PusijJs和ESM同时

具体答案 我需要为我们公司的各种前端项目使用的一些常见功能制作一个NPM包,但非常不确定如何正确执行。我们使用的是Typescript,tsdx似乎可以处理一些我不确定如何正确处理的事情,但它没有说明如何构造“实用程序”类型的包

这就是我推荐esm策略的原因:它非常适合同构代码,也就是说,该库在前端项目和后端节点项目上无缝工作

我不明白的是,当包中没有逻辑上的单个导出/类/函数时,package.json中的“main”应该指向什么

package.json
“main”
“module”
字段是可选的——跳过它

我认为这是一种最佳实践:不要将单个入口点指定为“主入口”——相反,应该鼓励消费者明确选择他们想要的模块

从“authoritian/dist/toolbox/logger/makeLogger.js”导入{makeLogger}

像上面这样的显式导入比重新导出可能未使用模块的大型树的索引要好,最好通过只导入您需要的来避免树抖动

它应该只导出整个包中的每个“公共”函数吗?如果是这样的话,这将如何影响树的晃动(我目前还不太了解)和类似的事情

您只需要设置package.json
“files”
数组,告诉npm发布充满es模块的
“dist”
目录,还可以发布
“source”
,这样消费者在调试库中的任何内容时都可以获得良好的sourcemap体验

鼓励用户直接导入模块消除了树抖动问题——因为您不使用索引文件来聚合潜在的不需要的模块,您不必将它们抖掉——无论如何,处理使用fat索引模块的包是消费者关心的问题

[…]看来打包的路径通常会包含dist或lib之类的内容,这是我真正不想要的

是的,这在美学上也曾困扰过我,但我已经克服了

现在我喜欢它,包很简单,从根开始,而且
dist
source
之间有区别(比如访问源地图进行调试等),所以区别是公平的

一个人应该如何构建一个“多功能NPM包”,以获得干净的进口和工作树震动和其他好东西

我认为这个答案的策略会提供你想要的

有没有人在GitHub或其他可用的地方有这样的库的好的、干净的、简单的例子?我曾经尝试过像lodash这样的项目,但它们通常不是由Typescript编写的,而且通常似乎有相当复杂的设置,包括mono repos、工作区、自定义构建脚本等等

我还没有制作出受欢迎的软件包(还没有,muahahaha!),但我的图书馆可以做到。。我已经做了很多了