How to use introspection / Schema Awareness on React Native application?

[Svarto]

Hi,

I am trying to set up Schema Awareness through the introspection example you have in the docs, to my understanding I need to download the schema and add it through my ./assets folder - and then call it when initializing the urql client?

Should I have each app downloading the schema at startup, or is it better to just bundle it in the app bundle (as the schema shouldn't change that often)?

A follow-on question, I am trying to run the example in the docs in a simple node setup, i.e. npm init and then import the packages required. This was my thinking of just downloading the schema as a json on my laptop and then pass it into the app bundle through the ./assets folder. However, I am running into a weird import problem:

Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/Users/svarto/Documents/test_server/node_modules/graphql/utilities/getIntrospectionQuery' imported from /Users/svarto/Documents/test_server/node_modules/@urql/introspection/dist/urql-introspection.mjs
Did you mean to import graphql/utilities/getIntrospectionQuery.js?
    at finalizeResolution (internal/modules/esm/resolve.js:274:11)
    at packageResolve (internal/modules/esm/resolve.js:667:12)
    at moduleResolve (internal/modules/esm/resolve.js:715:14)
    at Loader.defaultResolve [as _resolve] (internal/modules/esm/resolve.js:808:11)
    at Loader.resolve (internal/modules/esm/loader.js:82:40)
    at Loader.getModuleJob (internal/modules/esm/loader.js:226:28)
    at ModuleWrap.<anonymous> (internal/modules/esm/module_job.js:51:40)
    at link (internal/modules/esm/module_job.js:50:36) {
  code: 'ERR_MODULE_NOT_FOUND'
}

This is my simple package.json:

{
  "name": "test_server",
  "version": "1.0.0",
  "description": "",
  "main": "introspection.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "type": "module",
  "dependencies": {
    "@urql/core": "^1.13.1",
    "@urql/introspection": "^0.1.0",
    "fs": "0.0.1-security",
    "graphql": "^15.3.0",
    "node-fetch": "^2.6.1"
  }
}

Any help on best practices and also how to get the example to work (if I should run it outside of the React Native application) would be very appreciated!

[kitten]

Hiya 👋 This is pretty interesting. It looks like Node isn't resolving the direct file of .mjs here, which makes sense I suppose since it always expects the direct path. The interesting thing about this is that this does work in @urql/core.

For now you may want to make sure that Node doesn't load the .mjs file by directly referencing @urql/introspection/dist/urql-introspection.js but in the meantime I'll have a look at what's going on.

Can you let me know which version of Node you're using please?

[Svarto]

Sure! I am using v14.6.0 on a Macbook Pro. Thanks a lot! I ended up just pulling the schema using graphqlurl as detailed here (https://hasura.io/docs/1.0/graphql/core/schema/export-graphql-schema.html#using-graphqurl, as I realized that since you need the admin password to get the schema - I do not want to keep it on my git repository nor in the app :)