我正在尝试 https://github.com/FormidableLabs/urql/tree/master/packages/svelte-urql 所做的惊人作品伙计们。
直到今天的问题,一切都很好。
我正在使用下面的代码,它给了我这个错误:
Error: Function called outside component initialization
at get_current_component (index.mjs:615)
at getContext (index.mjs:648)
at getClient (urql-svelte.mjs:55)
at query (urql-svelte.mjs:81)
at Players.svelte:41
代码:
<script>
import { query } from '@urql/svelte'
import { myQuery } from './myQuery'
let players
let myVars
function sleep (ms) {
return new Promise((resolve) => setTimeout(resolve, ms))
}
$: (async () => {
await sleep(2000) // this gives me the error; removing it make it work
players = query({
query: myQuery,
variables: { ...myVars },
requestPolicy: 'cache-and-network'
})
})()
</script>
{#if !players}
Loading players...
{:else}
Players loaded! Do the work.
{/if}
你能提出什么问题吗?
如果我使用
await()
在 onMount()
有用!像这样:onMount(async () => {
await sleep(2000)
loaded = true
})
这里是
@urql/svelte
的代码:也许
context
代码?import { setContext, getContext } from 'svelte';
import { Client, ClientOptions } from '@urql/core';
const CLIENT = '$$_URQL';
export const getClient = (): Client => getContext(CLIENT);
export const setClient = (client: Client): void => {
setContext(CLIENT, client);
};
export const initClient = (args: ClientOptions): Client => {
const client = new Client(args);
setClient(client);
return client;
};
如果您需要,我可以在 CodeSandbox 上创建一个 REPL,没问题。
@urql/svelte
上的错误: https://github.com/FormidableLabs/urql/issues/795.关于您的 Svelte 项目的信息:
- Chrome 83
- slim 版:3.23.0
- 卷起
最佳答案
如果使用 Vite 作为捆绑器,则需要排除 @urql/svelte
从依赖预捆绑,这显然对我造成了这个错误。
将此添加到您的 Vite 配置中:
{
optimizeDeps: {
exclude: ['@urql/svelte']
}
}
这也适用于 svelte-apollo
, 做同样的事情但是替换包名!Vite 文档 dependency pre-bundling在那里,如果好奇的话。
关于javascript - @urql/svelte,如果不在 onMount 中,则为 "Function called outside component initialization",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62101637/