javascript - Jest 对 Shoelace 库有一些问题

Question

在 StencilJs 中，我在组件中导入了Shoelace库，如下所示：

import module from '@shoelace-style/shoelace/dist/components/card/card';
if (!customElements.get('sl-card')) customElements.define('sl-card', module);

在测试中我得到这个错误：

SyntaxError: 不能在模块外使用 import 语句。

你知道为什么鞋带组件会开玩笑地导致这个错误吗？

Answer 1

您需要启用 ESM。Jest 有实验性支持，但您需要选择加入：

1. 确保您通过传递 transform: {} 禁用代码转换，或者将您的转换器配置为发出 ESM 而不是默认的 CommonJS (CJS)。
2. 使用 --experimental-vm-modules 执行节点，例如 node --experimental-vm-modules node_modules/jest/bin/jest.js 或 NODE_OPTIONS=--experimental-vm-modules npx jest 等。在 Windows 上，您可以使用cross-env 能够设置环境变量。
3. 除此之外，我们尝试遵循节点的逻辑来激活“ESM 模式”（例如查看 package.json 或 .mjs 文件中的类型），有关详细信息，请参阅他们的文档。
4. 如果您想将其他文件扩展名（例如 .jsx 或 .ts）视为 ESM，请使用 extensionsToTreatAsEsm 选项。