从 npm 包中添加 dist 文件以构建答案

【问题标题】：Add dist file from npm package to build从 npm 包中添加 dist 文件以构建
【发布时间】：2019-12-11 21:23:58
【问题描述】：

我在基于反应的项目中使用node-poweredup npm package。我提供了一个 nodejs 和一个浏览器版本的库。浏览器版本可从 jsdelivr CDN 获得，这也是我将这个库添加到我的 react 应用程序的方式 - 我只是将 powerup.js 包含在 index.html 的脚本标记中。

我可以看到 node-poweredup 模块在其 dist/browser 文件夹 (node_modules/node-poweredup/dist/browser/poweredup.js) 中有相同的文件。运行yarn build时如何将此js文件复制到我的构建目录，以便我可以使用这个而不是CDN中的那个？

我有一个使用create-react-app 创建的标准反应应用程序。

【问题讨论】：

不确定我是否完全不理解，但您是否尝试过： import poweredup from 'node-pweredup/dist/browser/poweredup.js' ？或者只是 import 'node-poweredup/...rest_of_file' - 第二个如果你不想使用实际导入的文件而只是包含在你的包中
谢谢，这让我走上了正轨。我正在使用打字稿，我可以做一个import "node-poweredup/dist/browser/poweredup.js"，然后像const poweredUP = new window.PoweredUP.PoweredUP();一样使用它。
投票this proposal 以缓解标签混淆。

标签： javascript reactjs yarnpkg

【解决方案1】：

尝试正常导入。删除 CDN。 react-scripts 会在构建过程中打包文件。

如果问题仍然存在，请将整个目录 node_modules/node-poweredup 复制到 node_modules 之外并执行绝对导入。

import * from './node-poweredup/${path}'

提供模块所在的路径

或者，最好只下载 CDN 并使用 script 标签导入 index.js

【讨论】：