diff --git a/docs/Libraries.md b/docs/Libraries.md new file mode 100644 index 000000000..9dad157c3 --- /dev/null +++ b/docs/Libraries.md @@ -0,0 +1,67 @@ +--- +id: libraries +title: Linking Libraries +layout: docs +category: Guides +permalink: docs/linking-libraries.html +next: debugging +--- + +Not every app uses all the native capabilities, and including the code to support +all those features would impact in the binary size... But we still want to make +easy to add these features whenever you need them. + +With that in mind we exposed many of these features as independent static libraries. + +For most of the libs it will be as simples as dragging two files, sometimes a third +step will be necessary, but no more than that. + +_All the libraries we ship with React Native live on the `Libraries` folder in +the root of the repository. Some of them are pure JavaScript, and you just need +to `require` it. Other libraries also rely on some native code, in that case +you'll have to add these files to your app, otherwise the app will throw an +error as soon as you try to use the library._ + +## Here the few steps to link your libraries that contain native code + +### Step 1 + +If the library has native code, there must be a `.xcodeproj` file inside it's +folder. +Drag this file to your project on Xcode (usually under the `Libaries` group +on Xcode); + +![](/react-native/img/AddToLibraries.png) + +### Step 2 + +Click on your main project file (the one that represents the `.xcodeproj`) +select `Build Phases` and drag the static library from the `Products` folder +insed the Library you are importing to `Link Binary With Libraries` + +![](/react-native/img/AddToBuildPhases.png) + +### Step 3 + +Not every library will need this step, what you need to consider is: + +_Do I need to know the contents of the library at compile time?_ + +What that means is, are you using this library on the native site or just in +JavaScript? If you are just using it in JavaScript, you are good to go! + + +This step is not necessary for all libraries that we ship we React Native but +`PushNotificationIOS` and `LinkingIOS`. + +In the case of the `PushNotificationIOS` for example, you have to call a method +on the library from your `AppDelegate` every time a new push notifiation is +received. + +For that we need to know the library's headers. To achieve that you have to go +to your project's file, select `Build Settings` and search for `Header Search +Paths`. There you should include the path to you library (if it has relevant +files on subdirectories remember to make it `recursive`, like `React` on the +example). + +![](/react-native/img/AddToSearchPaths.png) diff --git a/docs/NativeModulesIOS.md b/docs/NativeModulesIOS.md index a9037f002..d0f491eba 100644 --- a/docs/NativeModulesIOS.md +++ b/docs/NativeModulesIOS.md @@ -4,7 +4,7 @@ title: Native Modules (iOS) layout: docs category: Guides permalink: docs/nativemodulesios.html -next: debugging +next: libraries --- Sometimes an app needs access to platform API, and React Native doesn't have a corresponding wrapper yet. Maybe you want to reuse some existing Objective-C or C++ code without having to reimplement it in JavaScript. Or write some high performance, multi-threaded code such as image processing, network stack, database or rendering. diff --git a/website/src/react-native/img/AddToBuildPhases.png b/website/src/react-native/img/AddToBuildPhases.png new file mode 100644 index 000000000..7b8393702 Binary files /dev/null and b/website/src/react-native/img/AddToBuildPhases.png differ diff --git a/website/src/react-native/img/AddToLibraries.png b/website/src/react-native/img/AddToLibraries.png new file mode 100644 index 000000000..652cdfd1c Binary files /dev/null and b/website/src/react-native/img/AddToLibraries.png differ diff --git a/website/src/react-native/img/AddToSearchPaths.png b/website/src/react-native/img/AddToSearchPaths.png new file mode 100644 index 000000000..ccbe819ba Binary files /dev/null and b/website/src/react-native/img/AddToSearchPaths.png differ