![](/img/trans.png)
[英]Cannot find module './App.svelte' or its corresponding type declarations
[英]Cannot find module './SLink.svelte' or its corresponding type declarations
我正在嘗試在現有項目中使用 Svelte 和 TypeScript 配置 Jest。
我已經按照本文設置了所有內容(使用 Babel 和ts-jest )。
當我運行測試時,我得到了這個:
FAIL src/tests/methods.test.ts
● Test suite failed to run
src/router/components/index.ts:1:19 - error TS2307: Cannot find module './SLink.svelte' or its corresponding type declarations.
1 import SLink from './SLink.svelte';
~~~~~~~~~~~~~~~~
Test Suites: 1 failed, 1 total
Tests: 0 total
Snapshots: 0 total
Time: 2.705 s
Ran all test suites.
npm ERR! Test failed. See above for more details.
我導入了其他不會引發此錯誤的組件,唯一的區別是SLink
被導入到常規.ts
文件中,而我的其他組件被導入到其他組件中( App.svelte
)。
如果我將導出更改為空字符串,它會按原樣進行測試(盡管,它仍然會引發無法呈現此組件的錯誤)。
這篇 SO 帖子建議添加我已經完成的@tsconfig/svelte
。
如果我在導入上方添加// @ts-ignore
,它會完全按照它應該的方式工作,但是,還有其他方法可以解決這個問題嗎?
src/tests/methods.test.ts:
import { render } from '@testing-library/svelte';
import App from '../App.svelte';
test('should render', () => {
const results = render(App);
expect(() => results.getByText('Hello world!')).not.toThrow();
});
src/路由器/組件/index.ts:
import SLink from './SLink.svelte';
export { SLink };
SLink
是一個普通的 Svelte 組件,不使用 TypeScript。
jest.config.js:
module.exports = {
preset: 'ts-jest',
clearMocks: true,
coverageDirectory: 'coverage',
transform: {
'^.+\\.svelte$': [
'svelte-jester',
{
preprocess: true,
},
],
'^.+\\.ts$': 'ts-jest',
'^.+\\.js$': 'babel-jest',
},
moduleFileExtensions: ['js', 'ts', 'svelte'],
};
babel.config.js:
module.exports = {
presets: [
['@babel/preset-env', { targets: { node: 'current' } }],
'@babel/preset-typescript',
],
};
svelte.config.js:
import sveltePreprocess from 'svelte-preprocess';
module.exports = {
preprocess: sveltePreprocess(),
};
文件樹:
src
|_ tests
|_ methods.test.ts
|_ router
|_ components
|_ index.ts
|_ SLink.svelte
我看到了類似的錯誤,並且由於對另一個問題的回答,我意識到由於我的 tsconfig.json 文件中的覆蓋,我不小心停止了引用 Svelte 類型。
我的 tsconfig 擴展了 Svelte 默認值,但我在下面添加了compilerOptions
覆蓋:
{
"extends": "@tsconfig/svelte/tsconfig.json",
// ...
"compilerOptions": {
"types": ["node", "jest"]
}
}
在構建我的項目時,我遇到了這個錯誤(類似地,關於在.ts
文件中導入 Svelte 組件):
(!) Plugin typescript: @rollup/plugin-typescript TS2307: Cannot find module './App.svelte' or its corresponding type declarations.
似乎我不小心覆蓋了一些 Svelte 默認值。 根據上面鏈接的建議,我像這樣修改了我的 tsconfig(將"svelte"
添加到 types 數組):
{
// ...
"compilerOptions": {
"types": ["node", "svelte", "jest"]
}
}
就我而言,這解決了錯誤。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.