Integrating with NativeScript

You can use Apollo with NativeScript exactly as you would with normal Angular application.

To introduce Apollo to your app, install apollo-angular from npm and use them in your app as outlined in the setup article:

npm i apollo-angular

💡

Note: There are more packages to be installed, so check out the “initialization” article.

app.config.ts

import { provideApollo } from 'apollo-angular';
import { HttpLink } from 'apollo-angular/http';
import { NativeScriptHttpClientModule } from 'nativescript-angular/http-client';
import { NativeScriptModule } from 'nativescript-angular/nativescript.module';
import { ApplicationConfig, importProvidersFrom, inject } from '@angular/core';
import { InMemoryCache } from '@apollo/client/core';
 
export const appConfig: ApplicationConfig = {
  providers: [
    importProvidersFrom(NativeScriptModule, NativeScriptHttpClientModule), // this provides HttpClient
    provideApollo(() => {
      const httpLink = inject(HttpLink);
 
      return {
        link: httpLink.create({ uri: '/graphql' }),
        cache: new InMemoryCache(),
        // other options ...
      };
    }),
  ],
};

If you are new to using Apollo with Angular, you should probably read the Angular guide.

Examples

There are some Apollo examples written in NativeScript that you may wish to refer to:

The “Posts and Authors” example.

👋

If you’ve got an example to post here, please hit the “Edit this page on GitHub” button above and let us know!

Multiple Clients Migration Guide