Can't find variable: self when using datocms-client with react native

Hi,

I’m trying out DatoCMS with a react native app, but when I try to import anything from datocms-client (e.g. { SiteClient }) I get ‘Can’t find variable: self’ on the iPhone simulator.

I have “datocms-client”: “^2.0.8” in package.json.

Can anyone point me in the right direction.
Thanks in advance.

hello @casper.ravn welcome :slight_smile:

Can you please share the stacktrace of the error? Or can you share a snippet of the code to understand the context?

Thanks!

Thanks @mat_jack1

Just trying to fetch some data from the api.
expo v34.0.1
react v16.8.3

// App.js
import React, { Component } from 'react';
import { Text } from 'react-native';
import { SiteClient } from 'datocms-client';

// const client = new SiteClient('YOUR_API_READWRITE_TOKEN');

export default class App extends Component {

  render(){
    return (
      <Text>Hello</Text>
    );
  }
}

gives me this:
Can’t find variable: self

AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:131375:31 r AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:122333:25 AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:126661:18 r AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:122333:25 AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:126415:18 r AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:122333:25 AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:129952:18 r AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:122333:25 AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:126795:18 r AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:122333:25 AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:122369:21 AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:122370:6 AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:122321:81 AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:122322:4 loadModuleImplementation AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:276:14 AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:122270:35 loadModuleImplementation AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:276:14 AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:1385:48 loadModuleImplementation AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:276:14 guardedLoadModule AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:152:47 global code AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:132456:4

And if i remove the import of datocms-client the app outputs ‘hello’ with no errors as expected.

OK, I’m not sure what’s going on, but what are you trying to accomplish?

If it’s fetching some data I think you should use the GraphQL API which is faster to access and will also allow you to do less calls ending being even faster than using REST.

Or do you need to post to our API from the app?

Yeah I agree with you on GraphQL but I have an app that uses a RESTapi now, so it would be easier to migrate to DatoCMS this way, and eventually go with GraphQL at some later point.

I found that if I use this version I do get data back: “datocms-client”: “^0.3.17”,
by looking in this repo: https://github.com/javierarques/react-datocms

Something must have changed which breaks the client in react native in later versions.