init should always create a directory

Summary:
Although there are tools that do this for you (create-react-app, react-native), and other that assume you are already in the created directory before you invoke the command (typescript, git), creating the directory by the tool has a few benefits:

1. less risk of making an accidental mess when people assume they don't need to create the dir first (I definitely ended up with a node_modules in the wrong directory)
1. it provide a naive way of detecting plugin name conflicts early (at least for plugins you create yourself)
1. in the next diff I'll add a pkg suggestion to add the current directory to the search path for flipper plugins. In the current setup, that would require needing to suggest to add the parent directory, which somehow feels less logical
2. makes sure that the directory name follows npm conventions: the package.json name should match the current directory name (not super important, but e.g VSCode will show warnings otherwise)

Reviewed By: jknoxville

Differential Revision: D21619631

fbshipit-source-id: 6d027ad18f14659e0347a66cacf056eacbc65680

desktop/pkg/src/commands/init.ts

@@ -11,6 +11,7 @@ import {Command} from '@oclif/command';
 import {args} from '@oclif/parser';
 import path from 'path';
 import fs from 'fs-extra';
+import {spawnSync} from 'child_process';
 import recursiveReaddirImport from 'recursive-readdir';
 import {promisify} from 'util';
 import inquirer from 'inquirer';
@@ -37,18 +38,12 @@ export default class Init extends Command {
 
   public async run() {
     const {args} = this.parse(Init);
-    const outputDirectory: string = path.resolve(process.cwd(), args.directory);
-    console.log(
-      `⚙️  Initializing Flipper desktop template in ${outputDirectory}`,
-    );
-    const defaultID = path.basename(outputDirectory);
     const idQuestion: inquirer.QuestionCollection = [
       {
         type: 'input',
         name: 'id',
         message:
           'ID (must match native plugin ID, e.g. returned by getId() in Android plugin):',
-        default: defaultID,
       },
     ];
     const id: string = (await inquirer.prompt(idQuestion)).id;
@@ -60,9 +55,26 @@ export default class Init extends Command {
         default: id,
       },
     ];
+    const pluginDirectory: string = path.resolve(process.cwd(), args.directory);
+
     const title: string = (await inquirer.prompt(titleQuestion)).title;
     const packageNameSuffix = id.toLowerCase().replace(' ', '-');
     const templateItems = await recursiveReaddir(templateDir);
+    const outputDirectory = path.join(
+      pluginDirectory,
+      'flipper-plugin-' + packageNameSuffix,
+    );
+
+    if (fs.existsSync(outputDirectory)) {
+      console.error(`Directory '${outputDirectory}' already exists`);
+      process.exit(1);
+    }
+    await fs.ensureDir(outputDirectory);
+
+    console.log(
+      `⚙️  Initializing Flipper desktop template in ${outputDirectory}`,
+    );
+
     for (const item of templateItems) {
       const lstat = await fs.lstat(item);
       if (lstat.isFile()) {
@@ -84,8 +96,12 @@ export default class Init extends Command {
         await fs.writeFile(newFile, content);
       }
     }
+    spawnSync('yarn', ['install'], {cwd: outputDirectory, stdio: [0, 1, 2]});
     console.log(
-      `✅  Plugin template initialized. Package name: flipper-plugin-${packageNameSuffix}.`,
+      `✅  Plugin directory initialized. Package name: flipper-plugin-${packageNameSuffix}.`,
+    );
+    console.log(
+      `   Run 'cd flipper-plugin-${packageNameSuffix} && yarn watch' to get started!`,
     );
   }
 }