feat: adjust run instruction based on the user platform (#1285)

* chore: adjust run instruction based on the user platform

* chore: adjust whitespaces in run instructions

* Update packages/cli/src/commands/init/printRunInstructions.ts

* fix 'undefined' printed in instructions on Windows

* use short URLs

* fix black font in PS by changing Windows instructions header color

Co-authored-by: Michał Pierzchała <thymikee@gmail.com>

packages/cli/src/commands/init/printRunInstructions.ts

@@ -9,39 +9,63 @@
 
 import path from 'path';
 import fs from 'fs';
+import process from 'process';
 import chalk from 'chalk';
 import {logger} from '@react-native-community/cli-tools';
 
 function printRunInstructions(projectDir: string, projectName: string) {
- const iosProjectDir = path.resolve(projectDir, 'ios');
- const iosPodsFile = path.resolve(iosProjectDir, `${projectName}.xcworkspace`);
- const isUsingPods = fs.existsSync(iosPodsFile);
+ let iosInstructions = '';
+ let desktopInstructions = '';
 
- const relativeXcodeProjectPath = path.relative(
- '..',
- isUsingPods
- ? iosPodsFile
- : path.resolve(iosProjectDir, `${projectName}.xcodeproj`),
- );
+ if (process.platform === 'darwin') {
+ const iosProjectDir = path.resolve(projectDir, 'ios');
+ const iosPodsFile = path.resolve(
+ iosProjectDir,
+ `${projectName}.xcworkspace`,
+ );
+ const isUsingPods = fs.existsSync(iosPodsFile);
 
- logger.log(`
+ const relativeXcodeProjectPath = path.relative(
+ '..',
+ isUsingPods
+ ? iosPodsFile
+ : path.resolve(iosProjectDir, `${projectName}.xcodeproj`),
+ );
+
+ iosInstructions = `
  ${chalk.cyan(`Run instructions for ${chalk.bold('iOS')}`)}:
  • cd "${projectDir}" && npx react-native run-ios
  ${chalk.dim('- or -')}
  • Open ${relativeXcodeProjectPath} in Xcode or run "xed -b ios"
  • Hit the Run button
+ `;
+
+ desktopInstructions = `
+ ${chalk.magenta(`Run instructions for ${chalk.bold('macOS')}`)}:
+ • See ${chalk.underline(
+ 'https://aka.ms/ReactNativeGuideMacOS',
+ )} for the latest up-to-date instructions.
+ `;
+ }
 
+ if (process.platform === 'win32') {
+ desktopInstructions = `
+ ${chalk.cyan(`Run instructions for ${chalk.bold('Windows')}`)}:
+ • See ${chalk.underline(
+ 'https://aka.ms/ReactNativeGuideWindows',
+ )} for the latest up-to-date instructions.
+ `;
+ }
+
+ const androidInstructions = `
  ${chalk.green(`Run instructions for ${chalk.bold('Android')}`)}:
  • Have an Android emulator running (quickest way to get started), or a device connected.
  • cd "${projectDir}" && npx react-native run-android
+ `;
 
- ${chalk.magenta(
- `Run instructions for ${chalk.bold('Windows')} and ${chalk.bold('macOS')}`,
- )}:
- • See ${chalk.underline(
- 'https://aka.ms/ReactNative',
- )} for the latest up-to-date instructions.
-`);
+ logger.log(`
+ ${androidInstructions}${iosInstructions}${desktopInstructions}
+ `);
 }
 
 export default printRunInstructions;