iOS development build

Introduction

This page covers:

• Building development build for iOS mobile and tablet
• Checking lint and typescript errors and generating the _build folder
• Copying client-specific configuration files
• Copying localization
• Running the application (either in an emulator or connected device)
• Enabling hot reload

Build commands

To run or generate an app for iOS mobile or tablet, use these commands.

This command will run the application in an emulator with the default configuration.

yarn builds --platform=ios

For customization of builds, the same command is used but with additional parameters. 

yarn builds --client=sales --platform=ios --buildType=debug

Build command parameters

For a list of valid values for each parameter, refer to the table - build props and values.

Build process

It's recommended to run the build within IDE, so that the developer can fix any issues by selecting them to open the relevant file at the corresponding line.

Step 1: Lint validation in the  source code

This step checks for common errors in the source code. If any errors are found, they are listed in the console and the process will stop to wait for developer confirmation. If there are lint errors, they must be fixed before continuing otherwise the build will fail.

 ERROR:"lint" exited with 2.
 ERROR: Command failed with exit code 1.
 INFO:info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
 
The process raised an error. Would you like to continue?(y/n) 

Common lint errors

ERROR: ocb/src/ui/screens/explore/search.tsx[527, 50]: file should end with a newline
ERROR: ocb/src/ui/screens/explore/search.tsx[524, 1]: Consecutive blank lines are forbidden
ERROR: ocb/src/ui/screens/explore/search.tsx[297, 3]: Calls to 'console.log' are not allowed.
ERROR: ocb/src/ui/screens/explore/search.tsx[230, 52]: trailing whitespace
ERROR: ocb/src/ui/screens/explore/search.tsx[298, 1]: trailing whitespace
ERROR: ocb/src/ui/screens/explore/search.tsx[234, 19]: ' should be "
ERROR: ocb/src/ui/screens/explore/search.tsx[48, 28]: Missing semicolon
ERROR: ocb/src/ui/screens/explore/search.tsx[36, 1]: 'equals' is declared but its value is never read.

Step 2: Validate typescript functionality in the source code by tslint

Once the lint is successfully completed, the next step is to validate the typescript functionality errors.

If no typescript functionality errors are found, then the build will generate the _build folder and continue to the next step.

If there are any functionality errors in the source code, then it lists the errors in the console and the process will stop to wait for developer confirmation.

Functionality errors are mandatory to fix.

Common functionality errors

INFO:$ tslint --project tslint.json
ERROR: ocb/src/ui/screens/explore/search.tsx[69, 10]: variable name must be in lowerCamelCase, PascalCase or UPPER_CASE
ERROR: ocb/src/ui/screens/explore/search.tsx[38, 1]: 'isNumber' is declared but its value is never read.
ERROR: ocb/src/ui/screens/explore/search.tsx[69, 10]: '__isTV' is declared but its value is never read.

Step 3: Set client-specific configuration

Once the _build folder is successfully created, the next step is to set the client-specific configuration. For each client, there will be a different configuration such as API endpoint, features, UI theme, terms & conditions, etc.

These files will be copied to the ios folder.

This command is for copying platform configuration for client.

yarn copy-config-files demo ios

Step 4: Copy localization file

This command is for copying the localization file. It is common for all the clients.

yarn copy-localization

Step 5: Run on device or emulator

Now the build is ready to use, the application will be installed in development mode in the connected device or emulator.

react-native run-ios

Step 6: Enable hot reload

This command enables the hot reload for the application.

yarn dev-compile -w