节点模块中始终可用的 dist 文件夹

Question

我正在构建一个我自己的工具来反编译和打包相关的 js 文件（用 ES6 编写）到一个包中。到目前为止，本地文件按预期进行，但是当我使用公共模块时，例如 react 和 redux 等，情况就不一样了。我想知道如何将这些模块包含在包中？我发现在大多数具有分布式版本的公共模块中总是有 dist 文件夹。那么，dist 文件夹总是在任何模块目录中可用吗？

Answer 1

Webpack 使用与Node.js相同的模块解析。node_modules有一个package.json具有main字段的字段，该字段确定在代码中导入模块时要导入的文件。此外，webpack 会查找browser或 中的module字段，如果它们存在，则package.json优先main考虑它们。这使得发布不同于常规 Node.js 构建的构建变得容易（例如，使用 ES 模块（import/ export），Node.js 尚不支持这些模块，但像 webpack 这样的打包器支持这些模块）。可以使用选项resolve.mainFields配置此行为。举个例子，看看package.jsonRedux 的。

这些字段都不是强制性的，但至少main应该存在，所以你可以简单地导入一个模块：

import module from 'module';

或与require：

const module = require('module');

Webpack 会自动包含您导入包中的模块。

该dist 目录没有什么特别之处，但dist包含 UMD 构建的目录很常见。特别是因为Unpkg允许您导入节点模块而无需手动将其发布到 CDN，它默认使用dist或umd（如主页底部所述）。