-
-
Notifications
You must be signed in to change notification settings - Fork 517
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
How to use in a project that is setup using Vue CLI@3 and TypeScript? #444
Comments
@praveenpuglia https://github.com/Akryum/vue-cli-plugin-apollo For now, you can define like below codes on main.ts to fix error report.
|
Thanks for the comment. This really helps! I have one more small doubt. for If so, how do I pass all clients to say, I tried |
Currently this is what I'm doing: const clients = this.$apollo.provider.clients
for (const client of Object.keys(clients)) {
await clients[client].resetStore()
} |
@quentinus95 this works, but TS complains about |
@praveenpuglia For now, please ignore error report on typescript. @Akryum |
Thanks so much! Really waiting for this to get merged. |
Hi, I'm facing a similar issue to this. I install a new project using the cli + typescript and have done these same workarounds, but even after that I'm getting the below errors (multiples) and can't seem to find anything regarding this. Any info you can provide is appreciated; I'm new to Typescript, but need to use it for this project. Thanks in advance!
|
@jeissler |
@joe-re thanks for your reply; I've abandoned typescript for this project 20 days ago citing the above issues. It seems like TS isn't something that's well supported although I am still hoping to use the vue-apollo package. |
Version - 3.0.0-beta.27 Hi! Thanks so much for merging the PR but I feel it still doesn't solve the problem entirely. I do get The How can I resolve that? |
Ok, So I solve it this way. Just let me know if this is correct. In vue-apollo.ts, I created these two. export type VueApolloClient = ApolloClient<InMemoryCache> & {
wsClient: SubscriptionClient;
};
export interface VueApolloClients {
[key: string]: VueApolloClient;
} And then in the component where I call the onLogout(this.$apollo.provider.clients as VueApolloClients); Finally going back to vue-apollo.ts I changed the signatures of export async function onLogin(clients: VueApolloClients, token: string) {
if (typeof localStorage !== 'undefined' && token) {
localStorage.setItem(AUTH_TOKEN, token);
}
resetCacheAndSockets(clients);
}
async function resetCacheAndSockets(clients: VueApolloClients) {
for (const client of Object.keys(clients)) {
if (clients[client].wsClient) {
restartWebsockets(clients[client].wsClient);
}
try {
await clients[client].resetStore();
} catch (e) {
/* tslint:disable-next-line:no-console */
console.log(
'%cError on cache reset (logout)',
'color: orange;',
e.message
);
}
}
} |
I tried to change {
"compilerOptions": {
..............
"allowJs": true
}, Please advise |
td;dr
How do I include vue-apollo in a project that already uses TypeScript?
I created a fresh vue project using vue cli@3 and using typescript.
Then I added the
vue-apollo
plugin which modified my main.ts file to addin the vue instance creation.
But the compiler complains about this.
I can see that there is a types directory in the vue-apollo package I fetched from npm but not sure how to use them.
I also get the following
for the following import in main.ts
I get that this might be coming from the
noImplicitAny
rule but then changing the generated vue-apollo.js to vue-apollo.ts also doesn't solve the problems.Changing it to
.ts
removes the compiler errors from main.ts about the above two but then I get the following.for
To fix this, I can add a module declaration in my typings like this but is that the right way?
and the
onLogin
oronLogout
paramapolloClient
starts complaining about them being implicitlyany
type too.The text was updated successfully, but these errors were encountered: