@nx/react-native 17.0.5 → 17.0.6

package/src/executors/run-ios/run-ios.impl.ts

@@ -1,9 +1,9 @@
-import { ExecutorContext, GeneratorCallback, workspaceRoot } from '@nx/devkit';
+import { ExecutorContext } from '@nx/devkit';
 import { resolve as pathResolve } from 'path';
 import { ChildProcess, fork } from 'child_process';
 import { platform } from 'os';
 
-import { runCliStart } from '../start/start.impl';
+import startExecutor from '../start/start.impl';
 import { getCliOptions } from '../../utils/get-cli-options';
 
 import { ReactNativeRunIosOptions } from './schema';
@@ -21,20 +21,29 @@ export default async function* runIosExecutor(
   const projectRoot =
     context.projectsConfigurations.projects[context.projectName].root;
 
-  const tasks = [runCliRunIOS(context.root, projectRoot, options)];
-
   if (options.mode !== 'Release') {
-    tasks.push(
-      runCliStart(context.root, projectRoot, {
+    const startResults = startExecutor(
+      {
         port: options.port,
         resetCache: options.resetCache,
         interactive: true,
-      })
+      },
+      context
     );
+    for await (const result of startResults) {
+      if (result.success) {
+        await runCliRunIOS(context.root, projectRoot, options);
+        yield {
+          success: true,
+        };
+      } else {
+        return result;
+      }
+    }
+  } else {
+    await runCliRunIOS(context.root, projectRoot, options);
   }
 
-  await Promise.all(tasks);
-
   yield { success: true };
 }
 

package/src/executors/run-ios/schema.json

@@ -3,7 +3,7 @@
   "outputCapture": "direct-nodejs",
   "cli": "nx",
   "$id": "NxReactNativeRunIos",
-  "$schema": "https://json-schema.org/schema",
+  "$schema": "http://json-schema.org/schema",
   "title": "Run iOS application",
   "description": "Run iOS target options.",
   "type": "object",

package/src/executors/start/schema.d.ts

@@ -1,4 +1,4 @@
-// options from https://github.com/facebook/react-native/blob/main/packages/community-cli-plugin/src/commands/start/index.js
+// options from https://github.com/react-native-community/cli/blob/main/packages/cli-plugin-metro/src/commands/start/index.ts
 
 export interface ReactNativeStartOptions {
   port: number;

package/src/executors/start/schema.json

@@ -3,7 +3,7 @@
   "outputCapture": "direct-nodejs",
   "cli": "nx",
   "$id": "NxReactNativeStart",
-  "$schema": "https://json-schema.org/schema",
+  "$schema": "http://json-schema.org/schema",
   "title": "Packager Server for React Native",
   "description": "Packager Server target options.",
   "type": "object",

package/src/executors/start/start.impl.js

@@ -7,11 +7,25 @@ const path_1 = require("path");
 const is_packager_running_1 = require("./lib/is-packager-running");
 async function* startExecutor(options, context) {
     const projectRoot = context.projectsConfigurations.projects[context.projectName].root;
-    await runCliStart(context.root, projectRoot, options);
+    const startProcess = await runCliStart(context.root, projectRoot, options);
     yield {
         port: options.port,
         success: true,
     };
+    if (!startProcess) {
+        return;
+    }
+    await new Promise((resolve) => {
+        const processExitListener = (signal) => () => {
+            startProcess.kill(signal);
+            resolve();
+            process.exit();
+        };
+        process.once('exit', (signal) => startProcess.kill(signal));
+        process.once('SIGTERM', processExitListener);
+        process.once('SIGINT', processExitListener);
+        process.once('SIGQUIT', processExitListener);
+    });
 }
 exports.default = startExecutor;
 /*
@@ -33,7 +47,7 @@ async function runCliStart(workspaceRoot, projectRoot, options) {
             return await startAsync(workspaceRoot, projectRoot, options);
         }
         catch (error) {
-            devkit_1.logger.error(`Failed to start the packager server. Error details: ${error.message ?? error}`);
+            devkit_1.logger.error(`Failed to start the packager server. Error details: ${error.message}`);
             throw error;
         }
     }
@@ -44,7 +58,16 @@ function startAsync(workspaceRoot, projectRoot, options) {
         const childProcess = (0, child_process_1.fork)(require.resolve('react-native/cli.js'), ['start', ...createStartOptions(options)], {
             cwd: (0, path_1.resolve)(workspaceRoot, projectRoot),
             env: process.env,
-            stdio: 'inherit',
+            stdio: ['inherit', 'pipe', 'pipe', 'ipc'],
+        });
+        childProcess.stdout.on('data', (data) => {
+            process.stdout.write(data);
+            if (data.toString().includes('reload the app')) {
+                resolve(childProcess);
+            }
+        });
+        childProcess.stderr.on('data', (data) => {
+            process.stderr.write(data);
         });
         childProcess.on('error', (err) => {
             reject(err);
@@ -57,14 +80,6 @@ function startAsync(workspaceRoot, projectRoot, options) {
                 reject(code);
             }
         });
-        const processExitListener = (signal) => () => {
-            childProcess.kill(signal);
-            process.exit();
-        };
-        process.once('exit', (signal) => childProcess.kill(signal));
-        process.once('SIGTERM', processExitListener);
-        process.once('SIGINT', processExitListener);
-        process.once('SIGQUIT', processExitListener);
     });
 }
 function createStartOptions(options) {

package/src/executors/start/start.impl.ts

@@ -16,12 +16,27 @@ export default async function* startExecutor(
   const projectRoot =
     context.projectsConfigurations.projects[context.projectName].root;
 
-  await runCliStart(context.root, projectRoot, options);
+  const startProcess = await runCliStart(context.root, projectRoot, options);
 
   yield {
     port: options.port,
     success: true,
   };
+
+  if (!startProcess) {
+    return;
+  }
+  await new Promise<void>((resolve) => {
+    const processExitListener = (signal?: number | NodeJS.Signals) => () => {
+      startProcess.kill(signal);
+      resolve();
+      process.exit();
+    };
+    process.once('exit', (signal) => startProcess.kill(signal));
+    process.once('SIGTERM', processExitListener);
+    process.once('SIGINT', processExitListener);
+    process.once('SIGQUIT', processExitListener);
+  });
 }
 
 /*
@@ -46,9 +61,7 @@ export async function runCliStart(
       return await startAsync(workspaceRoot, projectRoot, options);
     } catch (error) {
       logger.error(
-        `Failed to start the packager server. Error details: ${
-          error.message ?? error
-        }`
+        `Failed to start the packager server. Error details: ${error.message}`
       );
       throw error;
     }
@@ -67,10 +80,20 @@ function startAsync(
       {
         cwd: pathResolve(workspaceRoot, projectRoot),
         env: process.env,
-        stdio: 'inherit',
+        stdio: ['inherit', 'pipe', 'pipe', 'ipc'],
       }
     );
 
+    childProcess.stdout.on('data', (data) => {
+      process.stdout.write(data);
+      if (data.toString().includes('reload the app')) {
+        resolve(childProcess);
+      }
+    });
+    childProcess.stderr.on('data', (data) => {
+      process.stderr.write(data);
+    });
+
     childProcess.on('error', (err) => {
       reject(err);
     });
@@ -81,15 +104,6 @@ function startAsync(
         reject(code);
       }
     });
-
-    const processExitListener = (signal?: number | NodeJS.Signals) => () => {
-      childProcess.kill(signal);
-      process.exit();
-    };
-    process.once('exit', (signal) => childProcess.kill(signal));
-    process.once('SIGTERM', processExitListener);
-    process.once('SIGINT', processExitListener);
-    process.once('SIGQUIT', processExitListener);
   });
 }
 

package/src/executors/storybook/storybook.impl.d.ts

@@ -1,9 +1,5 @@
 import { ExecutorContext } from '@nx/devkit';
 import { ReactNativeStorybookOptions } from './schema';
-/**
- * TODO (@xiongemi): remove this function in v19.
- * @deprecated Going to use the default react storybook target. Use @nx/react:storybook executor instead.
- */
 export default function reactNativeStorybookExecutor(options: ReactNativeStorybookOptions, context: ExecutorContext): AsyncGenerator<{
     success: boolean;
 }>;

package/src/executors/storybook/storybook.impl.js

@@ -8,20 +8,13 @@ const chalk = require("chalk");
 const glob_1 = require("glob");
 const sync_deps_impl_1 = require("../sync-deps/sync-deps.impl");
 const fs_extra_1 = require("fs-extra");
-/**
- * TODO (@xiongemi): remove this function in v19.
- * @deprecated Going to use the default react storybook target. Use @nx/react:storybook executor instead.
- */
 async function* reactNativeStorybookExecutor(options, context) {
     const projectRoot = context.projectsConfigurations.projects[context.projectName].root;
     devkit_1.logger.info(`${chalk.bold.cyan('info')} To see your Storybook stories on the device, you should start your mobile app for the <platform> of your choice (typically ios or android).`);
     // add storybook addons to app's package.json
     const packageJsonPath = (0, path_1.join)(context.root, projectRoot, 'package.json');
-    const workspacePackageJsonPath = (0, path_1.join)(context.root, 'package.json');
-    const workspacePackageJson = (0, devkit_1.readJsonFile)(workspacePackageJsonPath);
-    const projectPackageJson = (0, devkit_1.readJsonFile)(packageJsonPath);
     if ((0, fileutils_1.fileExists)(packageJsonPath))
-        (0, sync_deps_impl_1.displayNewlyAddedDepsMessage)(context.projectName, await (0, sync_deps_impl_1.syncDeps)(context.projectName, projectPackageJson, packageJsonPath, workspacePackageJson, context.projectGraph, [
+        (0, sync_deps_impl_1.displayNewlyAddedDepsMessage)(context.projectName, await (0, sync_deps_impl_1.syncDeps)(context.projectName, projectRoot, context.root, context.projectGraph, [
             `@storybook/react-native`,
             '@storybook/addon-ondevice-actions',
             '@storybook/addon-ondevice-backgrounds',
@@ -35,13 +28,7 @@ async function* reactNativeStorybookExecutor(options, context) {
 }
 exports.default = reactNativeStorybookExecutor;
 function runCliStorybook(workspaceRoot, options) {
-    const storiesFiles = options.searchDir.flatMap((dir) => {
-        const storyFilePaths = (0, glob_1.sync)((0, path_1.join)(dir, options.pattern));
-        return storyFilePaths.map((storyFilePath) => {
-            const loaderPath = (0, path_1.resolve)((0, path_1.dirname)(options.outputFile));
-            return (0, path_1.relative)(loaderPath, storyFilePath);
-        });
-    });
+    const storiesFiles = options.searchDir.flatMap((dir) => (0, glob_1.sync)((0, path_1.join)(dir, options.pattern)));
     if (storiesFiles.length === 0) {
         devkit_1.logger.warn(`${chalk.bold.yellow('warn')} No stories found.`);
     }

package/src/executors/storybook/storybook.impl.ts

@@ -1,5 +1,5 @@
-import { join, relative, resolve, dirname } from 'path';
-import { ExecutorContext, logger, readJsonFile } from '@nx/devkit';
+import { join } from 'path';
+import { ExecutorContext, logger } from '@nx/devkit';
 import { fileExists } from '@nx/workspace/src/utilities/fileutils';
 import * as chalk from 'chalk';
 import { sync as globSync } from 'glob';
@@ -10,12 +10,7 @@ import {
   syncDeps,
 } from '../sync-deps/sync-deps.impl';
 import { writeFileSync } from 'fs-extra';
-import { PackageJson } from 'nx/src/utils/package-json';
 
-/**
- * TODO (@xiongemi): remove this function in v19.
- * @deprecated Going to use the default react storybook target. Use @nx/react:storybook executor instead.
- */
 export default async function* reactNativeStorybookExecutor(
   options: ReactNativeStorybookOptions,
   context: ExecutorContext
@@ -30,21 +25,13 @@ export default async function* reactNativeStorybookExecutor(
 
   // add storybook addons to app's package.json
   const packageJsonPath = join(context.root, projectRoot, 'package.json');
-  const workspacePackageJsonPath = join(context.root, 'package.json');
-
-  const workspacePackageJson = readJsonFile<PackageJson>(
-    workspacePackageJsonPath
-  );
-  const projectPackageJson = readJsonFile<PackageJson>(packageJsonPath);
-
   if (fileExists(packageJsonPath))
     displayNewlyAddedDepsMessage(
       context.projectName,
       await syncDeps(
         context.projectName,
-        projectPackageJson,
-        packageJsonPath,
-        workspacePackageJson,
+        projectRoot,
+        context.root,
         context.projectGraph,
         [
           `@storybook/react-native`,
@@ -66,15 +53,9 @@ export function runCliStorybook(
   workspaceRoot: string,
   options: ReactNativeStorybookOptions
 ) {
-  const storiesFiles: string[] = options.searchDir.flatMap((dir) => {
-    const storyFilePaths: string[] = globSync(join(dir, options.pattern));
-
-    return storyFilePaths.map((storyFilePath) => {
-      const loaderPath: string = resolve(dirname(options.outputFile));
-      return relative(loaderPath, storyFilePath);
-    });
-  });
-
+  const storiesFiles: string[] = options.searchDir.flatMap((dir) =>
+    globSync(join(dir, options.pattern))
+  );
   if (storiesFiles.length === 0) {
     logger.warn(`${chalk.bold.yellow('warn')} No stories found.`);
   }

package/src/executors/sync-deps/schema.d.ts

@@ -1,5 +1,4 @@
 export interface ReactNativeSyncDepsOptions {
   include: string[] | string; // default is an empty array []
   exclude: string[] | string; // default is an empty array []
-  all: boolean; // default is false
 }

package/src/executors/sync-deps/schema.json

@@ -3,7 +3,7 @@
   "outputCapture": "direct-nodejs",
   "cli": "nx",
   "$id": "NxReactNativeSyncDeps",
-  "$schema": "https://json-schema.org/schema",
+  "$schema": "http://json-schema.org/schema",
   "title": "Sync Deps for React Native",
   "description": "Updates `package.json` with project dependencies.",
   "type": "object",
@@ -23,11 +23,6 @@
       },
       "default": [],
       "description": "An array of npm packages to exclude."
-    },
-    "all": {
-      "type": "boolean",
-      "description": "Copy all dependencies and devDependencies from the workspace root package.json.",
-      "default": false
     }
   }
 }

package/src/executors/sync-deps/sync-deps.impl.d.ts

@@ -1,9 +1,8 @@
 import { ExecutorContext, ProjectGraph } from '@nx/devkit';
 import { ReactNativeSyncDepsOptions } from './schema';
-import { PackageJson } from 'nx/src/utils/package-json';
 export interface ReactNativeSyncDepsOutput {
     success: boolean;
 }
 export default function syncDepsExecutor(options: ReactNativeSyncDepsOptions, context: ExecutorContext): AsyncGenerator<ReactNativeSyncDepsOutput>;
-export declare function syncDeps(projectName: string, projectPackageJson: PackageJson, projectPackageJsonPath: string, workspacePackageJson: PackageJson, projectGraph?: ProjectGraph, include?: string[], exclude?: string[], all?: boolean): Promise<string[]>;
+export declare function syncDeps(projectName: string, projectRoot: string, workspaceRoot: string, projectGraph: ProjectGraph, include?: string[], exclude?: string[]): Promise<string[]>;
 export declare function displayNewlyAddedDepsMessage(projectName: string, deps: string[]): void;

package/src/executors/sync-deps/sync-deps.impl.js

@@ -7,29 +7,22 @@ const devkit_1 = require("@nx/devkit");
 const find_all_npm_dependencies_1 = require("../../utils/find-all-npm-dependencies");
 async function* syncDepsExecutor(options, context) {
     const projectRoot = context.projectsConfigurations.projects[context.projectName].root;
-    const workspacePackageJsonPath = (0, path_1.join)(context.root, 'package.json');
-    const projectPackageJsonPath = (0, path_1.join)(context.root, projectRoot, 'package.json');
-    const workspacePackageJson = (0, devkit_1.readJsonFile)(workspacePackageJsonPath);
-    const projectPackageJson = (0, devkit_1.readJsonFile)(projectPackageJsonPath);
-    displayNewlyAddedDepsMessage(context.projectName, await syncDeps(context.projectName, projectPackageJson, projectPackageJsonPath, workspacePackageJson, context.projectGraph, typeof options.include === 'string'
+    displayNewlyAddedDepsMessage(context.projectName, await syncDeps(context.projectName, projectRoot, context.root, context.projectGraph, typeof options.include === 'string'
         ? options.include.split(',')
         : options.include, typeof options.exclude === 'string'
         ? options.exclude.split(',')
-        : options.exclude, options.all));
+        : options.exclude));
     yield { success: true };
 }
 exports.default = syncDepsExecutor;
-async function syncDeps(projectName, projectPackageJson, projectPackageJsonPath, workspacePackageJson, projectGraph = (0, devkit_1.readCachedProjectGraph)(), include = [], exclude = [], all = false) {
-    let npmDeps = all
-        ? Object.keys(workspacePackageJson.dependencies || {})
-        : (0, find_all_npm_dependencies_1.findAllNpmDependencies)(projectGraph, projectName);
-    let npmDevdeps = all
-        ? Object.keys(workspacePackageJson.devDependencies || {})
-        : [];
+async function syncDeps(projectName, projectRoot, workspaceRoot, projectGraph, include = [], exclude = []) {
+    let npmDeps = (0, find_all_npm_dependencies_1.findAllNpmDependencies)(projectGraph, projectName);
+    const packageJsonPath = (0, path_1.join)(workspaceRoot, projectRoot, 'package.json');
+    const packageJson = (0, devkit_1.readJsonFile)(packageJsonPath);
     const newDeps = [];
     let updated = false;
-    if (!projectPackageJson.dependencies) {
-        projectPackageJson.dependencies = {};
+    if (!packageJson.dependencies) {
+        packageJson.dependencies = {};
         updated = true;
     }
     if (include && include.length) {
@@ -38,30 +31,15 @@ async function syncDeps(projectName, projectPackageJson, projectPackageJsonPath,
     if (exclude && exclude.length) {
         npmDeps = npmDeps.filter((dep) => !exclude.includes(dep));
     }
-    if (!projectPackageJson.devDependencies) {
-        projectPackageJson.devDependencies = {};
-    }
-    if (!projectPackageJson.dependencies) {
-        projectPackageJson.dependencies = {};
-    }
     npmDeps.forEach((dep) => {
-        if (!projectPackageJson.dependencies[dep] &&
-            !projectPackageJson.devDependencies[dep]) {
-            projectPackageJson.dependencies[dep] = '*';
-            newDeps.push(dep);
-            updated = true;
-        }
-    });
-    npmDevdeps.forEach((dep) => {
-        if (!projectPackageJson.dependencies[dep] &&
-            !projectPackageJson.devDependencies[dep]) {
-            projectPackageJson.devDependencies[dep] = '*';
+        if (!packageJson.dependencies[dep]) {
+            packageJson.dependencies[dep] = '*';
             newDeps.push(dep);
             updated = true;
         }
     });
     if (updated) {
-        (0, devkit_1.writeJsonFile)(projectPackageJsonPath, projectPackageJson);
+        (0, devkit_1.writeJsonFile)(packageJsonPath, packageJson);
     }
     return newDeps;
 }

package/src/executors/sync-deps/sync-deps.impl.ts

@@ -2,16 +2,15 @@ import { join } from 'path';
 import * as chalk from 'chalk';
 import {
   ExecutorContext,
-  ProjectGraph,
   logger,
-  readCachedProjectGraph,
+  ProjectGraph,
   readJsonFile,
   writeJsonFile,
 } from '@nx/devkit';
 
-import { ReactNativeSyncDepsOptions } from './schema';
 import { findAllNpmDependencies } from '../../utils/find-all-npm-dependencies';
-import { PackageJson } from 'nx/src/utils/package-json';
+
+import { ReactNativeSyncDepsOptions } from './schema';
 
 export interface ReactNativeSyncDepsOutput {
   success: boolean;
@@ -23,31 +22,19 @@ export default async function* syncDepsExecutor(
 ): AsyncGenerator<ReactNativeSyncDepsOutput> {
   const projectRoot =
     context.projectsConfigurations.projects[context.projectName].root;
-
-  const workspacePackageJsonPath = join(context.root, 'package.json');
-  const projectPackageJsonPath = join(
-    context.root,
-    projectRoot,
-    'package.json'
-  );
-
-  const workspacePackageJson = readJsonFile(workspacePackageJsonPath);
-  const projectPackageJson = readJsonFile(projectPackageJsonPath);
   displayNewlyAddedDepsMessage(
     context.projectName,
     await syncDeps(
       context.projectName,
-      projectPackageJson,
-      projectPackageJsonPath,
-      workspacePackageJson,
+      projectRoot,
+      context.root,
       context.projectGraph,
       typeof options.include === 'string'
         ? options.include.split(',')
         : options.include,
       typeof options.exclude === 'string'
         ? options.exclude.split(',')
-        : options.exclude,
-      options.all
+        : options.exclude
     )
   );
 
@@ -56,26 +43,20 @@ export default async function* syncDepsExecutor(
 
 export async function syncDeps(
   projectName: string,
-  projectPackageJson: PackageJson,
-  projectPackageJsonPath: string,
-  workspacePackageJson: PackageJson,
-  projectGraph: ProjectGraph = readCachedProjectGraph(),
+  projectRoot: string,
+  workspaceRoot: string,
+  projectGraph: ProjectGraph,
   include: string[] = [],
-  exclude: string[] = [],
-  all: boolean = false
+  exclude: string[] = []
 ): Promise<string[]> {
-  let npmDeps = all
-    ? Object.keys(workspacePackageJson.dependencies || {})
-    : findAllNpmDependencies(projectGraph, projectName);
-  let npmDevdeps = all
-    ? Object.keys(workspacePackageJson.devDependencies || {})
-    : [];
-
+  let npmDeps = findAllNpmDependencies(projectGraph, projectName);
+  const packageJsonPath = join(workspaceRoot, projectRoot, 'package.json');
+  const packageJson = readJsonFile(packageJsonPath);
   const newDeps = [];
   let updated = false;
 
-  if (!projectPackageJson.dependencies) {
-    projectPackageJson.dependencies = {};
+  if (!packageJson.dependencies) {
+    packageJson.dependencies = {};
     updated = true;
   }
 
@@ -86,36 +67,16 @@ export async function syncDeps(
     npmDeps = npmDeps.filter((dep) => !exclude.includes(dep));
   }
 
-  if (!projectPackageJson.devDependencies) {
-    projectPackageJson.devDependencies = {};
-  }
-  if (!projectPackageJson.dependencies) {
-    projectPackageJson.dependencies = {};
-  }
-
   npmDeps.forEach((dep) => {
-    if (
-      !projectPackageJson.dependencies[dep] &&
-      !projectPackageJson.devDependencies[dep]
-    ) {
-      projectPackageJson.dependencies[dep] = '*';
-      newDeps.push(dep);
-      updated = true;
-    }
-  });
-  npmDevdeps.forEach((dep) => {
-    if (
-      !projectPackageJson.dependencies[dep] &&
-      !projectPackageJson.devDependencies[dep]
-    ) {
-      projectPackageJson.devDependencies[dep] = '*';
+    if (!packageJson.dependencies[dep]) {
+      packageJson.dependencies[dep] = '*';
       newDeps.push(dep);
       updated = true;
     }
   });
 
   if (updated) {
-    writeJsonFile(projectPackageJsonPath, projectPackageJson);
+    writeJsonFile(packageJsonPath, packageJson);
   }
 
   return newDeps;