外部和全局变量 SAPPER 客户端使用汇总生成



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

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

如果我们给它全局,它会将导入结果"设置"到捆绑包中的全局umd

但是在使用时做同样的事情sapper使模块保持为外部模块,然后服务器构建正常工作,但客户端构建不考虑全局变量,而是尝试在浏览器中执行"导入",并且失败了,并且 TypeError ,

':无法解析模块说明符"..."。

是否可以在客户端构建中将库保留为外部库sapper并指示它使用全局而不是导入?或者我在这里弄错了一些非常基本的原理?

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

import foo from 'foo';

那么你的服务器代码将有类似的东西

const foo = require('foo');

(由于节点模块解析算法,这是有效的(,并且在您的客户端 JS 中,您最终会得到完全相同的import......这在浏览器中不起作用,因为导入路径必须是相对的。(将来导入地图可能会更改此情况。

最简单的解决方案是不使用external,而只是让 Rollup 处理它(您可以只为客户端执行此操作(。但是,如果您确实想使用全局,则可以使用@rollup/plugin-virtual

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

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

相关内容

  • 没有找到相关文章

最新更新