时间戳

首页 > 解决方案 > 与 Rollup 捆绑时忽略或替换依赖项的导入

javascript - 与 Rollup 捆绑时忽略或替换依赖项的导入

问题描述

我正在使用 Rollup 捆绑一个 JS 库。这个库依赖于@tensorflow/tfjs-core。

在 tfjs 的代码中，有一个获取 URL 的函数。如果是在浏览器环境中，则使用全局fetch函数；如果不是，它会尝试导入node-fetch.

这些行中的一些东西：

fetch(path: string, requestInits?: RequestInit): Promise<Response> {
  if (env().global.fetch != null) {
    return env().global.fetch(path, requestInits);
  }

  if (systemFetch == null) {
    systemFetch = require('node-fetch');
  }

  return systemFetch(path, requestInits);
}

我的库是在浏览器中运行的，所以它总是使用全局fetch函数。但是，Rollup 仍然node-fetch在我的 lib 资产中捆绑了 require 。

这应该不是问题，但是一些消费者在使用 webpack 的 React 项目中使用该库时会报告错误：

编译失败。

./node_modules/[my lib]/index.js 找不到模块：'node-fetch'。确保已安装此软件包。

你可以通过运行：npm install node-fetch 来安装这个包。

问题是：有什么方法可以告诉 Rollup 不是没有捆绑包吗？

我想过在生成捆绑包后替换require('node-fetch')by undefined，但感觉就像一个肮脏的黑客。还有什么建议吗？

PS：我相信标记node-fetch为external消费者项目可以解决问题，但由于我不在node-fetch我的库中使用，所以最好将其从最终输出中删除。

标签： javascriptwebpackrollupjs

解决方案

其他包管理器可以包含或排除基于环境的文件test，development, production, 等。

有很多方法可以实现这一点，甚至可以做到

# Makefile

ENVIRONMENT ?= test

ROLLUP = $(which rollup)

ENVSUBST = $(which envsubst)

rollup.config.js: src/$(ENVIRONMENT)
    ${ENVSUBST} < $@ > $^
    ${ROLLUP} $^ -o $(ENVIRONMENT).js

如果您创建了以您的环境命名的文件，您可以使用

make -e environment=browser

我不希望我的代码能够工作，只是为了表达想法。

推荐阅读