### Minimal Expo Project Setup Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Quickly set up a new Expo project, navigate into its directory, and start the development server. ```bash npm create expo my-app cd my-app npm start ``` -------------------------------- ### Skip Installation Example Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Creates the project structure but skips the dependency installation phase. This is useful if you intend to manage dependencies manually or in a separate step. ```bash create-react-native-app my-project --no-install # Creates project structure but doesn't run npm/yarn or CocoaPods ``` -------------------------------- ### Minimal React Native Community Project Setup Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Set up a new bare React Native project and start the development server for Android or iOS. ```bash npx @react-native-community/cli init MyApp cd MyApp npm run android # or npm run ios ``` -------------------------------- ### Setup Development Environment for Expo CLI Source: https://github.com/expo/create-react-native-app/blob/main/CONTRIBUTING.md Follow these steps to clone the repository, install dependencies, link packages, and build the project. Configure commit message templates for consistency. ```bash git config commit.template .github/.COMMIT_TEMPLATE ``` ```bash yarn start ``` -------------------------------- ### Non-Interactive Mode Example Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Creates a project using default settings without interactive prompts. This example specifies using npm for dependency installation. ```bash create-react-native-app my-project --yes --use-npm # Creates project in ./my-project using npm, with default template ``` -------------------------------- ### Start Expo Project Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Run this command to start the development server and test your migrated Expo project. ```bash npm start ``` -------------------------------- ### Project Setup Logging Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Logs the progress of a project setup process, indicating success or failure. Throws an error if setup fails. ```typescript const step = Template.logNewSection('Setting up project'); try { // Do work step.succeed('Project set up successfully'); } catch (error) { step.fail('Failed to set up project'); throw error; } ``` -------------------------------- ### Install Expo CLI and Initialize Project Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Installs Expo CLI globally and initializes a new project using Expo. ```bash # Install Expo CLI npm install -g eas-cli expo-cli # Initialize project expo init my-app ``` -------------------------------- ### Install React Native Community CLI and Initialize Project Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Installs the React Native Community CLI globally and initializes a new project. ```bash # Install community CLI npm install -g @react-native-community/cli # Initialize project npx @react-native-community/cli init MyProject ``` -------------------------------- ### Install Create React Native App Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/quick-reference.md Install the CLI globally for system-wide access, or locally within a project. Using `npx` is the recommended approach to ensure you're using the latest version without global installation. ```bash # Global npm install -g create-react-native-app # In a project npm install create-react-native-app # Via npx (recommended) npx create-react-native-app ``` -------------------------------- ### Install Project Dependencies Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md Installs all project dependencies using Yarn. ```bash yarn install ``` -------------------------------- ### Run Production Build Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md Execute the command to start a production build. This process optimizes the output for smaller file sizes and faster startup. ```bash yarn build ``` -------------------------------- ### Install and Enable Husky Hook Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/testing.md After creating the pre-push hook script, install husky and make the hook executable. This ensures the hook is active and functional. ```bash husky install chmod +x .husky/pre-push ``` -------------------------------- ### Install Node Dependencies Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Asynchronously installs Node.js dependencies for a project using npm or yarn. Exits if installation fails. ```typescript async function installNodeDependenciesAsync( projectRoot: string, packageManager: 'npm' | 'yarn' ): Promise { const step = Template.logNewSection('Installing dependencies'); try { await execa(packageManager, ['install'], { cwd: projectRoot }); step.succeed(); } catch (error) { step.fail('Failed to install dependencies'); process.exit(1); } } ``` -------------------------------- ### Interactive Mode Example Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Initiates project creation in interactive mode, prompting the user for template selection. The project will be created in the specified directory. ```bash create-react-native-app my-project # Prompts user to select template, then creates project in ./my-project ``` -------------------------------- ### Clone and Install Dependencies Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/quick-reference.md Clone the repository and install project dependencies using Yarn. ```bash git clone https://github.com/expo/create-react-native-app cd create-react-native-app yarn install ``` -------------------------------- ### Install React Native Community CLI Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Install the command-line interface for managing bare React Native projects. ```bash npm install -g @react-native-community/cli ``` -------------------------------- ### Log Project Ready Summary Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Displays a summary of the project setup completion, including the path to navigate to and the package manager used (npm or yarn). ```typescript export function logProjectReady(config: { cdPath: string packageManager: 'npm' | 'yarn' }): void ``` -------------------------------- ### Example package.json for Created Projects (v3.x) Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md This JSON object represents a typical package.json file generated by create-react-native-app in its v3.x versions. It includes project metadata, scripts for starting and building the app, and pinned versions of key dependencies like Expo, React, and React Native. ```json { "name": "my-app", "version": "1.0.0", "private": true, "scripts": { "start": "expo start", "android": "expo start --android", "ios": "expo start --ios", "test": "jest", "eject": "expo eject" }, "dependencies": { "expo": "^48.0.0", "react": "18.2.0", "react-native": "0.71.0" }, "devDependencies": { "@babel/preset-env": "^7.20.0", "jest": "^29.2.1" } } ``` -------------------------------- ### Run Development Build Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md Execute the command to start a development build. This process is faster and includes source maps for easier debugging. ```bash yarn build:dev ``` -------------------------------- ### Install Expo CLI Globally Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Install the EAS CLI and Expo CLI globally using npm. Alternatively, use npx to run the create-expo command without global installation. ```bash npm install -g eas-cli expo-cli ``` ```bash npx create-expo ``` -------------------------------- ### Run React Native Community Project (iOS) Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Start the iOS development build for your migrated React Native Community project. ```bash npm run ios ``` -------------------------------- ### runAsync() Function Signature Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md The main asynchronous entry point for orchestrating the project creation flow in `create-react-native-app` v3.x and earlier. It handles argument parsing, template selection, dependency installation, and native environment setup. ```typescript async function runAsync(): Promise ``` -------------------------------- ### Install Dependencies for Expo Project Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md After copying source code and reviewing dependencies, install the necessary packages for your new Expo project. ```bash npm install ``` -------------------------------- ### Examples Module Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Functions for managing template discovery and resolution, including an interactive prompt for selecting templates and resolving template arguments. ```APIDOC ## promptAsync ### Description Interactive prompt allowing user to select a template from available options. ### Method `async` ### Parameters None ### Response - `Promise`: The selected template name or null if cancelled. ``` ```APIDOC ## resolveTemplateArgAsync ### Description Resolve a template argument (name or URL) and download/extract to projectRoot. ### Method `async` ### Parameters #### Path Parameters - **projectRoot** (string) - Required - Destination directory - **step** (Spinner) - Required - Logger spinner for status updates - **templateArg** (string) - Required - Template name (from examples) or GitHub URL - **templatePath** (string | undefined) - Optional - Subdirectory within GitHub repo (if applicable) ### Response - `Promise` ``` ```APIDOC ## appendScriptsAsync ### Description Add npm scripts to package.json based on template type. ### Method `async` ### Parameters #### Path Parameters - **projectRoot** (string) - Required - The root directory of the project. ### Response - `Promise` ``` -------------------------------- ### Install Expo CLI and EAS CLI Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Install the necessary command-line tools for Expo development, including EAS Build and Expo CLI. ```bash npm install -g eas-cli expo-cli ``` -------------------------------- ### Run React Native Community Project (Android) Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Start the Android development build for your migrated React Native Community project. ```bash npm run android ``` -------------------------------- ### Execute External Process with Execa Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/testing.md This example demonstrates how to use the `execa` library to execute external processes within tests. It shows how to capture the result, which includes stdout, stderr, exitCode, and a failed status. ```javascript const result = await execa('node', [cli]); // result.stdout, result.stderr, result.exitCode, result.failed ``` -------------------------------- ### Bare Invocation Example Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/api-reference/cli.md Demonstrates invoking the CLI without arguments and shows the expected deprecation warning output and exit code. ```bash $ npx create-react-native-app ⚠️ This tool does not initialize new React Native projects. ... ``` -------------------------------- ### Install Expo Modules in Bare Workflow Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md If your project relies on Expo modules and you are migrating to the bare workflow, install 'expo' and 'react-native-unimodules' explicitly. Note that support may be limited. ```bash npm install expo react-native-unimodules ``` -------------------------------- ### Node.js Example: Handling Exit Code 1 with child_process Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/errors.md This Node.js example demonstrates how to use the `child_process` module to execute `npx create-react-native-app` and check its exit status. It logs the deprecation notice from stderr if the status is 1. ```javascript const { spawnSync } = require('child_process'); const result = spawnSync('npx', ['create-react-native-app'], { encoding: 'utf8' }); if (result.status === 1) { console.log('Got deprecation notice:'); console.log(result.stderr); } ``` -------------------------------- ### Template Module Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Functions for file operations and project setup, including extracting default templates and logging project status. ```APIDOC ## extractAndPrepareTemplateAppAsync ### Description Extract default template and prepare project structure. ### Method `async` ### Parameters #### Path Parameters - **projectRoot** (string) - Required - The root directory for the new project. ### Response - `Promise` ``` ```APIDOC ## logNewSection ### Description Create a logger spinner for status updates. ### Method `sync` ### Parameters #### Path Parameters - **message** (string) - Required - The message to display in the spinner. ### Response - `Spinner` - A logger spinner object. ``` ```APIDOC ## logProjectReady ### Description Display project completion summary and next steps. ### Method `sync` ### Parameters #### Path Parameters - **config** (object) - Required - Configuration object. - **cdPath** (string) - Required - The path to change directory into. - **packageManager** ('npm' | 'yarn') - Required - The package manager used. ### Response - `void` ``` -------------------------------- ### Add Native Features or Packages Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Add native features like 'expo-camera' using the Expo CLI, or install any other npm package, such as 'axios'. ```bash npx expo add expo-camera ``` ```bash npm install axios ``` -------------------------------- ### Capturing CLI Output in JavaScript (Node.js) Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/api-reference/cli.md Example of how to capture the standard error output and exit code of the CLI using Node.js's child_process.spawnSync. ```javascript const { spawnSync } = require('child_process'); const result = spawnSync('npx', ['create-react-native-app'], { encoding: 'utf8', }); console.log('Status:', result.status); console.log('Stdout:', result.stdout); console.log('Stderr:', result.stderr); // Output to stderr (use console.warn in Node.js to write to stderr) if (result.stderr.includes('This tool does not initialize')) { console.log('Deprecation notice detected'); } ``` -------------------------------- ### Previous Main Function Export (Pre-4.0.0) Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/api-reference/index.md Shows a historical example of the main asynchronous function that was exported in versions prior to 4.0.0 for programmatic project creation. ```typescript // This no longer exists in v4.0.0 async function runAsync(): Promise { // Main entry point logic } ``` -------------------------------- ### Run CLI Locally Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/quick-reference.md Steps to build the project and then run the CLI locally. ```bash yarn build # Build first node build/index.js # Run the CLI ``` -------------------------------- ### Create React Native Community Project Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Initialize a new bare React Native project using the React Native Community CLI. ```bash npx @react-native-community/cli init MyProject cd MyProject npx react-native start ``` -------------------------------- ### Create New Expo Project Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/quick-reference.md Use this command to initialize a new React Native project with Expo. ```bash npm create expo ``` -------------------------------- ### Install Older create-react-native-app Version Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md You can still install older versions of create-react-native-app from npm, but they are not recommended for creating new projects. ```bash npm install create-react-native-app@3.8.0 ``` -------------------------------- ### Create a New Expo Project Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Create a new Expo project named 'my-first-app' and navigate into its directory. ```bash npm create expo my-first-app cd my-first-app ``` -------------------------------- ### Create New React Native Community Project Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Initialize a new project using the React Native Community CLI. Change into the new project directory. ```bash npx @react-native-community/cli init MyApp cd MyApp ``` -------------------------------- ### Create New React Native CLI Project Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/quick-reference.md Use this command to initialize a new React Native project using the React Native CLI. ```bash npx @react-native-community/cli init ``` -------------------------------- ### Register CLI Command Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/configuration.md The package registers a CLI command when installed globally or via npx. Invoke via 'npx create-react-native-app' when installed as a dependency. ```bash create-react-native-app # Runs ./build/index.js ``` ```bash npx create-react-native-app ``` -------------------------------- ### Create Expo Project Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Initialize a new React Native project using Expo CLI. Supports npm, yarn, pnpm, and bun. ```bash npm create expo # or yarn create expo # or pnpm create expo # or bun create expo ``` -------------------------------- ### Bash Example: Checking Exit Code 1 Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/errors.md Consumer code can detect the deprecation notice by checking the exit code of the `npx create-react-native-app` command. This example shows how to do it in a Bash script. ```bash npx create-react-native-app if [ $? -eq 1 ]; then echo "create-react-native-app was invoked (deprecated)" fi ``` -------------------------------- ### Build for Distribution Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/quick-reference.md Command to create a production build of the application. ```bash yarn build # Production build ``` -------------------------------- ### Update Expo Alternative Command Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/quick-reference.md Example of how to update the command displayed for the Expo alternative. ```typescript {bold npx create-expo-app} ``` -------------------------------- ### Create New Expo Project Source: https://github.com/expo/create-react-native-app/blob/main/README.md Use these commands to create a new Expo project with bun, npm, pnpm, or yarn. To see all available options, use the --help flag. ```bash npm create expo bun create expo pnpm create expo yarn create expo ``` ```bash npx create-expo --help ``` -------------------------------- ### Run Project Tests Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/quick-reference.md Execute the project's test suite using the configured testing framework. ```bash expo-module test ``` -------------------------------- ### Capturing CLI Output in a Shell Script Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/api-reference/cli.md Example of how to capture the standard error output and exit code of the CLI in a bash script. ```bash #!/bin/bash output=$(npx create-react-native-app 2>&1) exit_code=$? echo "Exit code: $exit_code" echo "Output:" echo "$output" if [ $exit_code -eq 1 ]; then echo "The tool exited with deprecation notice." fi ``` -------------------------------- ### Previous CLI Options (3.x) Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/api-reference/index.md Illustrates the command-line interface options available in previous versions (3.x) of the create-react-native-app package, used for project initialization. ```typescript const program = new Command(packageJSON.name) .version(packageJSON.version) .arguments('') .option('--use-npm', 'Use npm to install dependencies') .option('-y, --yes', 'Use the default options for creating a project') .option('--no-install', 'Skip installing npm packages or CocoaPods') .option('-t, --template [template|url]', 'Template name from expo/examples or GitHub URL') .option('--template-path [name]', 'Path inside a GitHub repo where the example lives') // ... more options ``` -------------------------------- ### Build Project with NCC (Production) Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/quick-reference.md Use `ncc` to create a production-ready, minified build of the project's TypeScript entry point. The output is placed in the `build/` directory. ```bash ncc build ./src/index.ts -o build/ --minify ``` -------------------------------- ### Watch and Rebuild Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md Use this command to automatically rebuild the project on every change in the src/ directory. ```bash yarn watch ``` -------------------------------- ### Test on Android Emulator or iOS Simulator Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Run the application on an Android emulator or an iOS simulator using the respective npm scripts. ```bash npm run android ``` ```bash npm run ios ``` -------------------------------- ### Production Build with NCC Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/configuration.md Creates a production-ready build using Vercel NCC, minifying the output and disabling caching and source map registration for optimal distribution. ```bash yarn build # Runs: ncc build ./src/index.ts -o build/ --minify --no-cache --no-source-map-register # Output: build/index.js (minified, optimized for distribution) ``` -------------------------------- ### Run create-react-native-app CLI Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/README.md Execute the create-react-native-app command using npx. This command now only outputs a deprecation warning and exits. ```bash npx create-react-native-app ``` -------------------------------- ### Detect Package Manager (Yarn or npm) Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Determines whether Yarn or npm should be used for installing project dependencies. This is based on the presence and configuration of Yarn on the system. ```typescript export async function shouldUseYarn(): Promise ``` -------------------------------- ### Test Logs More Information Link Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/testing.md Ensures a link to documentation for more information is present in the standard error output. This test validates that users can find setup details. ```javascript it('logs more information link', async () => { expect(await execute()).toMatchObject({ stderr: expect.stringContaining('https://reactnative.dev/docs/environment-setup'), }); }); ``` -------------------------------- ### Build Pipeline Overview Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/architecture.md Describes the stages involved in the build process, from TypeScript source code to NPM distribution. ```text TypeScript Source (src/index.ts) ↓ TypeScript Compiler (tsc via ncc) ↓ Vercel NCC Bundler ↓ Single JavaScript File (build/index.js) ↓ NPM Distribution ↓ npx / npm install ``` -------------------------------- ### Get Global Logger Instance Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Returns the singleton instance of the global logger. Use this to access logging methods like log, warn, and error throughout the application. ```typescript export default function log(): Logger ``` -------------------------------- ### Basic Command Structure Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md The fundamental structure for creating a new React Native project using the CLI. The `` is a required positional argument specifying the target directory. ```bash create-react-native-app [options] ``` -------------------------------- ### Jest Assertion Example Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/testing.md Use Jest's .toMatchObject() for flexible assertions on command output. This method verifies specific properties like exit code and stderr content without requiring an exact match. ```javascript expect(result).toMatchObject({ exitCode: 1, stderr: expect.stringContaining('some text'), }) ``` -------------------------------- ### Create React Native Project with TypeScript Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Initialize a new React Native project using the React Native Community CLI with a TypeScript template. ```bash npx @react-native-community/cli init --template react-native-template-typescript ``` -------------------------------- ### CLI Invocation Syntax Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/api-reference/cli.md Shows how to invoke the create-react-native-app CLI using either direct execution or npx. ```bash create-react-native-app [arguments...] ``` ```bash npx create-react-native-app [arguments...] ``` -------------------------------- ### Publish to npm Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md Publishes the project to the npm registry. Requires npm credentials and publish rights. ```bash npm publish ``` -------------------------------- ### Check Production Build File Size Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md Inspect the file size of the production build. This helps in monitoring the bundle size before and after minification. ```bash ls -lh build/index.js ``` -------------------------------- ### Build Project with NCC (Development) Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/quick-reference.md Use `ncc` to create a development build of the project's TypeScript entry point. The output is placed in the `build/` directory without minification. ```bash ncc build ./src/index.ts -o build/ ``` -------------------------------- ### Debug Bundling with Source Maps Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md Create an unminified build with source maps for debugging. Use Node inspector for advanced debugging. ```bash yarn build:dev ``` ```bash node --inspect build/index.js ``` -------------------------------- ### Test CLI Compilation Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md Run this command to execute the compiled CLI and observe any deprecation warnings. ```bash node build/index.js ``` -------------------------------- ### Build Commands for create-react-native-app Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/README.md Commands for building the project using yarn. Includes development and production builds, cleaning artifacts, running tests, and linting. ```bash yarn build:dev # Development build with source maps and watch mode ``` ```bash yarn build # Production build (minified, no source maps) ``` ```bash yarn clean # Remove build artifacts ``` ```bash yarn test # Run Jest test suite ``` ```bash yarn lint # Run ESLint ``` -------------------------------- ### runAsync() Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Main asynchronous entry point that orchestrated the entire project creation flow for create-react-native-app v3.x. ```APIDOC ## Function: runAsync() ### Purpose Main asynchronous entry point that orchestrated the entire project creation flow. ### Signature ```typescript async function runAsync(): Promise ``` ### Process 1. Argument Parsing 2. Project Path Resolution 3. Template Selection 4. Template Download 5. Dependency Installation 6. CocoaPods Setup 7. Completion Messages ### Exit Behavior - Success: Prints "Project is ready!" and project commands, exits with code 0 - Failure: Prints error message, exits with code 1 ``` -------------------------------- ### Create Expo Project with TypeScript Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Use the Expo CLI to create a new project with TypeScript support by specifying the template during project creation. ```bash npm create expo -- --template ``` -------------------------------- ### Development Build with NCC Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/configuration.md Performs a development build using Vercel NCC, outputting source maps and enabling watch mode for faster iteration. ```bash yarn build:dev # Runs: ncc build ./src/index.ts -o build/ # Output: build/index.js (with source maps, watchable) ``` -------------------------------- ### Validate Before Publishing Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md Run these commands to ensure all tests pass, there are no linting errors, the production build succeeds, and the CLI runs manually before publishing. ```bash yarn test ``` ```bash yarn lint ``` ```bash yarn build ``` ```bash node build/index.js ``` -------------------------------- ### Test Logs Expo CLI Alternative Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/testing.md Verifies that the Expo CLI is suggested as a project initialization alternative in the standard error output. This checks for the first recommended alternative. ```javascript it('logs expo as alternative', async () => { expect(await execute()).toMatchObject({ stderr: expect.stringContaining(`npx create-expo-app`), }); }); ``` -------------------------------- ### Pre-publication Build Process Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md This script is a pre-publication hook that first cleans build artifacts and then performs a production build. ```bash yarn run clean && yarn run build ``` -------------------------------- ### Test Logs React Native Community CLI Alternative Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/testing.md Confirms that the React Native Community CLI is mentioned as another alternative for project initialization in stderr. This checks for the second recommended alternative. ```javascript it('logs @react-native-community/cli as alternative', async () => { expect(await execute()).toMatchObject({ stderr: expect.stringContaining(`npx @react-native-community/cli init`), }); }); ``` -------------------------------- ### Configure Production Build with NCC Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md Command to bundle the project for production using Vercel NCC. It minifies the output, disables caching, and omits source map registration. ```bash ncc build ./src/index.ts -o build/ --minify --no-cache --no-source-map-register ``` -------------------------------- ### Watch and Rebuild on Changes Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/quick-reference.md Continuously watch project files and rebuild the development version automatically when changes are detected. ```bash yarn build:dev -w ``` -------------------------------- ### ESLint Configuration Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md Minimal ESLint configuration that extends the 'universe' preset. Ensure this file is named .eslintrc.js. ```javascript // Minimal configuration (delegates to eslint-config-universe) module.exports = { extends: ['universe'], }; ``` -------------------------------- ### Custom Template from GitHub Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Downloads a project template from a specified GitHub repository. The `--template-path` option allows selecting a subdirectory within the repository. ```bash create-react-native-app my-project --template https://github.com/user/repo --template-path examples/bare-workflow # Downloads template from GitHub repo, uses files from /examples/bare-workflow subdirectory ``` -------------------------------- ### Build for Production Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Build the application for iOS and Android platforms using EAS Build. After building, submit the app to the stores using EAS Submit. ```bash eas build --platform ios eas build --platform android ``` ```bash eas submit ``` -------------------------------- ### Development Workflow Commands Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/quick-reference.md Commands for running the development workflow, including auto-rebuilding, testing, and linting. ```bash yarn watch # Auto-rebuild on changes yarn test # Run tests yarn lint # Check code ``` -------------------------------- ### Pre-publish Script Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/configuration.md This script is executed before publishing to NPM. It cleans previous build artifacts and performs a production build. ```bash yarn prepublishOnly # Runs: yarn run clean && yarn run build ``` -------------------------------- ### Project Directory Structure Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/architecture.md Illustrates the file organization after running `yarn build`. The `build/` directory contains the compiled and bundled output, which is the only part included in the npm tarball for distribution. ```bash create-react-native-app/ ├── build/ │ └── index.js # Compiled, bundled, optionally minified ├── src/ │ ├── index.ts │ └── __tests__/ ├── package.json └── ... (config files) ``` -------------------------------- ### Select Project Template Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/historical-api.md Prompts the user to select a project template from a list of choices. Returns the selected template's value. ```typescript async function selectTemplateAsync(): Promise { const response = await prompts({ type: 'select', name: 'template', message: 'Choose a template', choices: [ { title: 'Default', value: 'default' }, { title: 'Bare workflow', value: 'bare' }, // ... ], }); return response.template; } ``` -------------------------------- ### CLI Data Flow Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/architecture.md Illustrates the sequence of operations when a user invokes the create-react-native-app CLI, from command execution to process termination. ```text User invokes CLI ↓ ./build/index.js (Node.js executable) ↓ src/index.ts compiled and executed ↓ chalk.warn() — Formats message with colors ↓ console.warn() — Writes to stderr ↓ process.exit(1) — Terminates process ↓ Shell receives exit code 1 ``` -------------------------------- ### Chalk Usage for Styling Terminal Output Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/api-reference/cli.md Illustrates how the 'chalk' library is used within the CLI to format terminal output with colors and styles like bold and underline. ```typescript chalk`{yellow.bold ...}` // Yellow bold text chalk`{bold ...}` // Bold text chalk`{underline ...}` // Underlined text ``` -------------------------------- ### Copy Source Code to React Native Community Project Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md Copy your existing source code into the root directory of the newly created React Native Community project. ```bash cp -r ../old-project/src/* ./ ``` -------------------------------- ### Execute CLI Command Helper Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/testing.md This helper function spawns a Node.js child process to run the CLI. It catches errors to allow assertions on the exit code and other error properties. ```javascript const cli = require.resolve('../../build/index.js'); const execute = () => execa('node', [cli]).catch((error) => error); ``` -------------------------------- ### Copy Source Code to Expo Project Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/migration-guide.md After creating a new Expo project, copy your existing source code into the 'app' directory. ```bash cp -r ../old-project/src/* ./app/ ``` -------------------------------- ### Pre-commit Hook Configuration Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md Configures Husky and lint-staged to automatically lint and format staged JavaScript/TypeScript files before committing. ```json { "husky": { "hooks": { "pre-commit": "lint-staged" } }, "lint-staged": { "*.{js,ts}": [ "eslint --fix", "prettier --write", "git add" ] } } ``` -------------------------------- ### Add Pre-push Hook for Testing Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/testing.md Configure a pre-push hook using husky to ensure tests are run before allowing a push. This script executes the test suite via yarn test. ```bash #!/bin/sh . "$(dirname "$0")/_/husky.sh" yarn test ``` -------------------------------- ### Pre-publication Hook Source: https://github.com/expo/create-react-native-app/blob/main/_autodocs/build-system.md This command automatically runs before publishing to npm. It cleans the build directory and creates a new production build. ```bash yarn prepublishOnly ```