How do I import functions/files to a react native app?

Question

I'm using Sendbird to build a chat application using react native, but I can't seem to get it to run. I know the app itself works, because I used the javascript debugger and I was parsing my information to the console, but I can't seem to get sendbird.init to work. Do I need to import methods from sendbird like you have to do in order to use react functions?

Here are screenshots for reference:

Login Error: Sendbird not Defined

And the line they refer to, login.js:41 is where I call sendbird.init

edit: heres my code for login.js (everything up to the stylesheet)

import React,  { Component } from 'react';
import {
    View,
    Text,
    StyleSheet,
    TextInput,
    TouchableHighlight
} from 'react-native';

var sendbird = require('sendbird');

module.exports = React.createClass({
    getInitialState: function() {
        return {
            username: ''
        };
    },
    render: function() {
        return (
            <View style={styles.container}>
                <View style={styles.loginContainer}>
                    <TextInput
                    style={styles.input}
                    value={this.state.username}
                    onChangeText={(text) => this.setState({username: text})}
                    placeholder={'Enter User Nickname'}
                    maxLength={12}
                    multiline={false}
                    />

                    <TouchableHighlight
                    style={styles.button}
                    underlayColor={'#328FE6'}
                    onPress={this.onPress}
                    >
                        <Text style={styles.label}>LOGIN</Text>
                    </TouchableHighlight>
                </View>
            </View>
        );
    },
    onPress: function() {
        sendbird.init({
            app_id: '879010F5-E064-4D1E-BD15-5956D4A47688',
            guest_id: this.state.username,
            user_name: this.state.username,
            image_url: "",
            access_token: "",
            successFunc: (data) => {
                console.log('success');
            },
            errorFunc: (status, error) => {
                this.setState({username: ''});
            }
        });
    }
});

and the error that comes up now about the mapping: New error - tried everything listed here

Can you please add your code of login.js (especially around line 41) — Orlando, Jul 05 '16 at 11:35
done, did you get a chance to look at it? Also I don't know if this helps, but whenever I reload it finds dependencies and says transformed 626/627 even though it says 100% next to it. — Ashrant Kohli, Jul 07 '16 at 05:03

Orlando · Answer 1 · 2016-07-05T09:41:44.927

0

Add

var sendbird = require('sendbird');

at the beginning of your file. Look at the react-native sample in this repo for an example https://github.com/smilefam/SendBird-JavaScript

edited Jul 05 '16 at 09:41

answered Jul 05 '16 at 07:01

Orlando

1,576
2
15
20

I tried doing that, it said there was a problem with the module map. cleared the cache, deleted the watchman data, nothing worked. I'm going to try remaking the project now. – Ashrant Kohli Jul 05 '16 at 09:25
still not working, "unable to resolve module from .../sendbird/SendBird.min.js: unable to find this module in it's module map or any of the node_modules directories" but if I try npm list it shows up – Ashrant Kohli Jul 05 '16 at 10:38

score 0 · Accepted Answer · answered Sep 27 '16 at 08:37

0

Now SendBird SDK V3 supports the latest React Native without any problems.

Please update your SendBird SDK to V3 and then it should be fine.

Here's a sample project you can take a look at.

https://github.com/smilefam/SendBird-JavaScript

Thanks!

answered Sep 27 '16 at 08:37

Jin Ku

196
1
2

How do I import functions/files to a react native app?

2 Answers2