Just getting started with React-Native and I'm having some trouble requiring a static image.

Here's the very-basic code I have so far:

'use strict';



var React = require('react-native');

var {

  AppRegistry,

  StyleSheet,

  Text,

  Image,

  View,

} = React;



var buzz = React.createClass({

  render: function() {

    return (

      <View style={styles.container}>

        <Image source={require('image!bg')}  style={styles.bg}>

          <Text style={styles.welcome}>

            Welcome to Buzz! iOS interface to

          </Text>

          <Text style={styles.welcomeHeader}>Charityware</Text>

        </Image>

      </View>

    );

  }

});



var styles = StyleSheet.create({

  container: {

    flex: 1,

    justifyContent: 'center',

    alignItems: 'center',

    backgroundColor: 'transparent'

  },

  welcomeHeader: {

    fontWeight: '600',

    fontFamily: 'Helvetica',

    color: '#fff',

    fontSize: 50,

    alignSelf: 'center'

  },

  bg: {

    width: 400,

    height: 300,

    alignSelf: 'auto',



  },

  welcome: {

    fontSize: 20,

    textAlign: 'center',

    margin: 10,

  },

  instructions: {

    textAlign: 'center',

    color: '#333333',

  },

});



AppRegistry.registerComponent('buzz', () => buzz);

The main trouble area is:

    <Image source={require('image!bg')}  style={styles.bg}>

      <Text style={styles.welcome}>

        Welcome to Buzz! iOS interface to

      </Text>

      <Text style={styles.welcomeHeader}>Charityware</Text>

    </Image>

When packaging my app and running it, I get a render error:

I understand that you need to add images in xcode as an image set in order for the require call to find the image and have added an image set to that end:

...But to no avail. Anyone have any thoughts? I've read the docs and seem to be doing this in the prescribed way. Thanks!