Skip to content
Browse files
Introduce nativeImageSource API
Summary: The goal is to replace `require('image!...')` with an API that communicates better of what's going on under the hood.

Reviewed By: yungsters, fkgozali

Differential Revision: D4186241

fbshipit-source-id: b764588dbbd9494dd6905b2346e3274b575a9644
  • Loading branch information
frantic authored and Facebook Github Bot committed Nov 20, 2016
1 parent 15f848e commit dcbcda75ec6b969d885f5f7ac97728d45a9bee0d
Showing 1 changed file with 53 additions and 0 deletions.
@@ -0,0 +1,53 @@
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
* @providesModule nativeImageSource
* @flow
'use strict';

const Platform = require('Platform');

type SourceSpec = {
ios?: string,
android?: string,

// For more details on width and height, see
width: number,
height: number,

* In hybrid apps, use `nativeImageSource` to access images that are already available
* on the native side, for example in Xcode Asset Catalogs or Android's drawable folder.
* However, keep in mind that React Native Packager does not guarantee that the image exists. If
* the image is missing you'll get an empty box. When adding new images your app needs to be
* recompiled.
* Prefer Static Image Resources system which provides more guarantees, automates measurements and
* allows adding new images without rebuilding the native app. For more details visit:
function nativeImageSource(spec: SourceSpec): Object {
const uri =;
if (!uri) {
console.warn(`No image name given for ${Platform.OS}: ${JSON.stringify(spec)}`);

return {
width: spec.width,
height: spec.height,

module.exports = nativeImageSource;

0 comments on commit dcbcda7

Please sign in to comment.