Building You.i Platform Apps

Note

The procedures in this topic apply to all build target platforms except Roku. Building and testing Roku apps requires special setup due to the nature of the solution. See Building Roku Apps and Roku Server Builds.

The procedures in this topic assume you have installed the You.i CLI with yarn global add youi-cli and installed the You.i React Native software. For details, see Installing the You.i Platform Software.

Use the following procedure to build You.i React Native apps.

Pro tip

This topic shows you how to use youi-tv build to build a React Native app, and then points you to information on deploying your app. You can also use youi-tv run to build, deploy, and launch your app all in one step. Note that youi-tv run isn’t yet supported on Roku.

Build Procedure

Note

For Windows Users We recommend that you create your app at the root of your storage device (e.g., C:\) to avoid long path name. Avoid spaces in file name and path names, as spaces cause errors when building for Android on Windows.

Do the following steps from a Terminal in Mac or Linux, or a Windows PowerShell window in Windows:

Navigate to the youi subdirectory of your You.i React Native app:

cd MyApp/youi
(Optional) To exclude specific files or file extensions or file directories during asset copying before project generation, see Excluding Files or File Directories or File Extension
Generate and build the application:
1. For use on your local system, run:
  
  youi-tv build -p <platform> add -c Release if building a release version.
2. For use on a system other than the one running the Metro Bundler:
  
  youi-tv build -p <platform> --remote <IP Address>
  
  Where <IP Address> is the IP address of the machine running the Metro Bundler. Your local development platform’s IP address is used if this option isn’t specified.
3. If building for Android TV alone, run:
  
  youi-tv build -p android -d YI_ANDROID_TV_ONLY=ON
4. If building for both Android mobile and Android TV, run:
  
  youi-tv build -p android -d YI_ANDROID_TV=ON
5. If deploying to a PlayStation 4 (PS4) create the required .pkg file by running:
  
  youi-tv build -p ps4 -t <AppName>_package
  
  where <platform> is one of the following: osx, ios, tvos, android, uwp, tizen-nacl, ps4, or linux.
  
  See a list of supported target platforms you can build from your current development environment with youi-tv build --help.
Use the optional --local --file index.youi.js argument as required. For more details on using local, see Build System Customization.

The project file is generated in the build/osx/ subdirectory for Mac, build/linux/Debug subdirectory for Linux, and build\uwp subdirectory for Windows.
If necessary, load the resulting app onto a device. Ensure the device is on the same network as your development platform. For more information, see the steps in Target Platforms.
To use the Metro Bundler ( yarn server), open a new Terminal or Windows PowerShell window, then run:

cd <your application folder>, for example, cd MyApp

yarn start

The yarn server starts. Look for the following to appear in the window:

Loading dependency graph, done.

To stop the Metro Bundler, press Ctrl + C.

Note
If you start the Metro Bundler (yarn server) from anywhere other than your application’s project folder, you’ll see an error on the screen.
Go back to your previous Terminal or shell window and launch the app executable; for example in MyApp/youi/build/osx/Debug/MyApp.

The executable name and location varies depending on your target platform and if it’s a Debug or Release app. See Generated Files for details.

Pro tip
You.i React Native supports live reloading when using the Metro Bundler (yarn server). Many changes appear immediately in your application. To request an explicit reload, press CTRL + R or select Reload RN from the React Native Reload menu of the Dev Panel window. Be aware that live reloading is disabled when using --local.

Next, see Folder Structure to see the various parts of the code base.

Build System Customization

For more information on optional arguments for the build system, see youi-tv build.

If desired, you can set default values for the --file argument, bundle file name, bundle mode, and platform specific bundle modes by adding a youi object, as shown below, to the project’s package.json file:

"youi": {
  "entryFile": "index.youi.js",
  "bundleFileName": "index.youi.bundle",
  "defaultBundleMode": "local",
  "platformSpecificBundleModes": { "osx": "local",

where:

entryFile sets a default value for the --file argument.
defaultBundleMode sets the default for --local , --ram_bundle, and --remote is the default if the key doesn’t exist.
platformSpecificBundleModes is a list of platforms for which you want to set a default bundle mode. The default specified is used by the generate command.
sourcemapOutput generates a JSON output at the given path for debugging dynamic JS module loading.
bundlerConfiguration allows you to supply a custom metro configuration for RAM bundling options.

Note

Specifying --file with the youi-tv build or youi-tv generate commands overrides your custom value in package.json.