1

我正在尝试使用apollo-cache-persist,但我对文档感到困惑:https ://github.com/apollographql/apollo-cache-persist/blob/master/README.md#web 。

这是网络初始化代码:

import { InMemoryCache } from 'apollo-cache-inmemory';
import { persistCache } from 'apollo-cache-persist';

const cache = new InMemoryCache({...});

// await before instantiating ApolloClient, else queries might run before the cache is persisted
await persistCache({
  cache,
  storage: window.localStorage,
});

await persistCache()正在引发错误,我不明白如果没有异步它会如何工作。我猜我需要把它放在一个插件中,但我也不太清楚该怎么做。

有关 Apollo 客户端配置的更多信息,请参阅另一个问题:@client Apollo GQL tag breaks query

4

1 回答 1

1

我在 nuxt.js 上不是最新的。

看看作者的vue-cli-plugin-ssrvue-apollo。它通过使用 beforeApp、afterApp 异步回调main.js包装来进行修改,以恢复服务器发送的缓存。您可以在考虑合并客户端和服务器缓存的正确方法后找到一个放置异步挂钩的地方...new Vue(...)export async function createAppvue add @akryum/ssrentry-client.js

或者你可以做一些更简单的事情:

// vue-apollo.js
import { persistCache } from 'apollo-cache-persist'
export async function willCreateProvider() {
  await persistCache({ cache, storage: window.localStorage })
}

export function createProvider(options = {}) { }
// main.js
import { createProvider, willCreateProvider } from './vue-apollo'
willCreateProvider().then(() => {
  new Vue({
    router,
    apolloProvider: createProvider(),
    render: h => h(App),
  }).$mount('#app')
})

还有persistCacheSyncapollo-cache-persist-dev@^0.2.0

于 2019-12-01T07:17:43.830 回答