我正在尝试使用lit html创建一个空白项目,就像模板一样。我也想添加一些测试功能,所以我一直在努力让它与Karma一起工作。
我可以运行一个正常的测试,就像添加一样,没有任何错误,所以我认为Karma本身运行得还可以。但我不能运行任何涉及Web组件的测试我无法导入Web组件
我正在使用以下内容导出Web组件:export default class MyComponent ...
然后在测试文件上导入它:import MyComponent from 'pathToComponent/MyComponent'
当我运行测试时,我得到:
Error loading test file: /test/example.test.js
TypeError: Failed to fetch dynamically imported module: http://localhost:9876/base/test/example.test.js
我在github回购上有它:https://github.com/boguz/rollup-lit-redux,所以如果你需要查看我安装的其他软件包,你可以看得更好。
非常感谢您的帮助。非常感谢。
错误消息是由/test/example.test.js
引用的模块引起的-错误消息有点欺骗性。。。
无法动态获取导入的模块
线索是,您没有动态导入(也就是说,当您使用const module = await import('path')
时,如果失败,您会在该行上得到一个异常(,而是静态导入。该错误消息并不是因为找不到http://localhost:9876/base/test/example.test.js
,而是因为在该文件中找不到嵌套引用。
据猜测,example.test.js
包含一个import
,其相对路径为
import * as testFramework from './testFramework';
export default class MyComponent...
这在TypeScript和linting工具中有效,因为它可以将./testFramework
解析为./testFramework.d.ts
、./node_modules/@types/testFramework.d.ts
或您正在使用的任何类型的查找。
然而,在浏览器中,它并不知道您实际上想要./testFramework.js
或./testFramework/index.js
,它直接请求./testFramework
,得到404,然后为调用组件提供该错误。
简而言之:
- 如果静态导入(即使用
import * from ...
( - 但是你得到
无法获取动态导入的模块:filename.js
- 错误实际上是
filename.js
中的另一个静态import
,而不是filename.js
本身
网络选项卡将指出哪个依赖项是问题所在,因为它将是404,解决方法是使用构建工具解决这些导入,或者将.js文件的完整相对路径放在源代码中。