如何禁用从我的 npm 包导入子文件夹
How to disable subfolder importing from my npm package
我开发了一个 npm 包:
- 打字稿
- webpack
webpack.config:
{...
entry: './src/index.ts
}
图书馆树:
- package.json
- src
- - index.ts
- - ...all_my_code...
并且我从这个 index.ts 文件中导出我所有的库功能和类型。
问题是我的 /dist
目录最终安装在某人的 node_modules 中,其中包含我不希望我的图书馆用户使用的图书馆 src 的子文件夹(这是垃圾为他们)。
如何不导出这些子文件夹?
and I export all my library functionality and types from this index.ts file.
-- 您不能简单地从 index.ts
文件导出。您必须将您的 TypeScript 项目编译成 JavaScript,然后您的库的使用者应该使用您编译的 JavaScript。这意味着总会有 dist
个文件夹。
您应该发布 package.json
文件以及 dist
文件夹,不包括 src
文件夹。可以使用typescript生成声明文件,放在dist文件夹下。
不make主题是如何隐藏dist
文件夹,这样消费者就不会直接从那些dist文件夹导入。
您有三种选择 - 传统捆绑器、桶形模式或包导出。
捆绑器方法:使用 Webpack 或 Rollup 等捆绑器将所有内容捆绑到一个文件中。假设您有一个入口点:
{
// ...webpack config
entry: './src/index.ts'
}
这将只生成一个文件,如 bundle.js
或类似文件,具体取决于您的配置。然后使用 package.json
的 main
字段并提供此生成文件的路径。这是通常遵循的最传统的方法。
桶出口[=52=]:第二种变体是使用Barrel Pattern。然后,您将使用纯 Typescript 编译您的包,并将生成的文件放在 dist
文件夹中。但是使用桶形模式,您将使用桶形导出文件作为 main
文件配置。这样做的缺点是,如果你有像 CSS、SCSS 这样的自定义加载器、原始加载器,那么普通的 TS 编译器是不够的。
Package.json exports:终于可以使用新引入的Node.js package exports
了。这是未来推荐的方法,因为它是面向未来的,并且支持从 16.x.x
开始的 Node 版本。这也是隐藏在 dist
中编译的内部模块的最可靠方法。缺点是如果您打算将此库与旧版本 Node.js 一起使用,这将不起作用。此外,工具支撑边缘粗糙。
最后,您可以 mix-n-match 所有三种方法。我建议您使用带 package.json
exports
.
的 Barrel exports
On a side note, as a good practice, Rollup is a bundler to use when you intend to bundle a library. Webpack should be used when you plan to bundle an application.
我开发了一个 npm 包:
- 打字稿
- webpack
webpack.config:
{...
entry: './src/index.ts
}
图书馆树:
- package.json
- src
- - index.ts
- - ...all_my_code...
并且我从这个 index.ts 文件中导出我所有的库功能和类型。
问题是我的 /dist
目录最终安装在某人的 node_modules 中,其中包含我不希望我的图书馆用户使用的图书馆 src 的子文件夹(这是垃圾为他们)。
如何不导出这些子文件夹?
and I export all my library functionality and types from this index.ts file.
-- 您不能简单地从 index.ts
文件导出。您必须将您的 TypeScript 项目编译成 JavaScript,然后您的库的使用者应该使用您编译的 JavaScript。这意味着总会有 dist
个文件夹。
您应该发布 package.json
文件以及 dist
文件夹,不包括 src
文件夹。可以使用typescript生成声明文件,放在dist文件夹下。
不make主题是如何隐藏dist
文件夹,这样消费者就不会直接从那些dist文件夹导入。
您有三种选择 - 传统捆绑器、桶形模式或包导出。
捆绑器方法:使用 Webpack 或 Rollup 等捆绑器将所有内容捆绑到一个文件中。假设您有一个入口点:
{
// ...webpack config
entry: './src/index.ts'
}
这将只生成一个文件,如 bundle.js
或类似文件,具体取决于您的配置。然后使用 package.json
的 main
字段并提供此生成文件的路径。这是通常遵循的最传统的方法。
桶出口[=52=]:第二种变体是使用Barrel Pattern。然后,您将使用纯 Typescript 编译您的包,并将生成的文件放在 dist
文件夹中。但是使用桶形模式,您将使用桶形导出文件作为 main
文件配置。这样做的缺点是,如果你有像 CSS、SCSS 这样的自定义加载器、原始加载器,那么普通的 TS 编译器是不够的。
Package.json exports:终于可以使用新引入的Node.js package exports
了。这是未来推荐的方法,因为它是面向未来的,并且支持从 16.x.x
开始的 Node 版本。这也是隐藏在 dist
中编译的内部模块的最可靠方法。缺点是如果您打算将此库与旧版本 Node.js 一起使用,这将不起作用。此外,工具支撑边缘粗糙。
最后,您可以 mix-n-match 所有三种方法。我建议您使用带 package.json
exports
.
On a side note, as a good practice, Rollup is a bundler to use when you intend to bundle a library. Webpack should be used when you plan to bundle an application.