外部客户端和全局客户端使用汇总工具构建

Question

使用rollup进行构建支持外部和全局。

我们可以在代码中导入一个模块，并将其称为外部模块，然后rollup不会将其包含在包中。

如果我们给它全局变量，它会“设置”将结果导入umd包中的全局变量。

但是在使用sapper keeps模块作为外部模块时，使用相同的方法，然后服务器构建正常工作，但是客户端构建没有考虑全局变量，而是试图在浏览器中进行“导入”，并且失败了， TypeError

  

'：无法解析模块说明符“ ...”'。

是否可以在sapper客户端构建中将库保留为外部库，并指示其使用全局而不是导入？还是我在这里弄错了一些非常基础的东西？

Answer 1

将模块保留在包的外部时，实际上意味着import声明保留在生成的代码中。所以如果你有类似的东西

import foo from 'foo';

然后您的服务器代码将带有

const foo = require('foo');

（由于节点模块解析算法而起作用），在客户端JS中，您将得到完全相同的import ... 不起作用在浏览器中，因为导入路径需要相对。 （将来可能会随着导入地图而改变。）

最简单的解决方案是不使用external，而让Rollup处理它（您可以仅针对客户端执行此操作）。但是，如果您确实想使用全局变量，则可以使用@rollup/plugin-virtual：

plugins: [
  virtual({
    foo: `export default window.foo`
  }),
  // ...
]

，然后在<script>中添加一个指向src/template.html中文件的static标记。