Next.js Codebase Analysis <> create-next-app <> index.ts explained — Part 1.14

#javascript #webdev #nextjs #opensource

In the previous article, I wrote few meaningful comments for a short code snippet from index.ts and talked about Conf package.

In this article, I will write about Typescript prompt.

The following code shows the above prompt shown in the above image, but it is not an obvious prompt, it has some code around it for preferences.

if (!program.typescript && !program.javascript) {
      if (ciInfo.isCI) {
        // default to TypeScript in CI as we can't prompt to
        // prevent breaking setup flows
        program.typescript = getPrefOrDefault('typescript')
      } else {
        const styledTypeScript = blue('TypeScript')
        const { typescript } = await prompts(
          {
            type: 'toggle',
            name: 'typescript',
            message: `Would you like to use ${styledTypeScript}?`,
            initial: getPrefOrDefault('typescript'),
            active: 'Yes',
            inactive: 'No',
          },
          {
            /**
             * User inputs Ctrl+C or Ctrl+D to exit the prompt. We should close the
             * process and not write to the file system.
             */
            onCancel: () => {
              console.error('Exiting.')
              process.exit(1)
            },
          }
        )
        /**
         * Depending on the prompt response, set the appropriate program flags.
         */
        program.typescript = Boolean(typescript)
        program.javascript = !Boolean(typescript)
        preferences.typescript = Boolean(typescript)
      }
    }

Honestly, the original authors have done a pretty good job in explaining what the above code does, I did not add any.
The only thing I was not sure was program.javascript or program.typescript, then I remembered those are options passed in to the CLI as shown

npx create-next-app --javascript

npx create-next-app --typescript

Conclusion:

In this article, I explained about how the ? Would you like to use TypeScript? › No / Yes prompt is configured. This means that if you want to add your own prompts, you can do so and update the program[your-key] flag, cannot specifically think of any customisation atm, but knowing this won’t hurt.

I am building a platform that explains best practices used in open source by elite programmers. Join the waitlist and I will send you the link to the tutorials once they are ready.

If you have any questions, feel free to reach out to me at ramu.narasinga@gmail.com