In the previous article, I wrote about a prompt related to ESLint.
In this article, I will explain more prompts seeking user input about tailwind, src-dir and app.
if (
// Check if there is an argument --tailwind passed
!process.argv.includes('--tailwind') &&
!process.argv.includes('--no-tailwind')
) {
// Skip the prompt, if this package runs in CI
// ciInfo is from https://www.npmjs.com/package/ci-info
if (ciInfo.isCI) {
program.tailwind = getPrefOrDefault('tailwind')
} else {
// tw? why not styledTw like in the esLint?
const tw = blue('Tailwind CSS')
// This is the prompt configuration that shows you the tailwind prompt
// in the CLI
const { tailwind } = await prompts({
onState: onPromptState,
type: 'toggle',
name: 'tailwind',
message: `Would you like to use ${tw}?`,
initial: getPrefOrDefault('tailwind'),
active: 'Yes',
inactive: 'No',
})
program.tailwind = Boolean(tailwind)
preferences.tailwind = Boolean(tailwind)
}
}
// the above comments apply to the below prompts, I am keeping my
// comments DRY
if (
!process.argv.includes('--src-dir') &&
!process.argv.includes('--no-src-dir')
) {
if (ciInfo.isCI) {
program.srcDir = getPrefOrDefault('srcDir')
} else {
const styledSrcDir = blue('`src/` directory')
const { srcDir } = await prompts({
onState: onPromptState,
type: 'toggle',
name: 'srcDir',
message: `Would you like to use ${styledSrcDir}?`,
initial: getPrefOrDefault('srcDir'),
active: 'Yes',
inactive: 'No',
})
program.srcDir = Boolean(srcDir)
preferences.srcDir = Boolean(srcDir)
}
}
if (!process.argv.includes('--app') && !process.argv.includes('--no-app')) {
if (ciInfo.isCI) {
program.app = getPrefOrDefault('app')
} else {
const styledAppDir = blue('App Router')
const { appRouter } = await prompts({
onState: onPromptState,
type: 'toggle',
name: 'appRouter',
message: `Would you like to use ${styledAppDir}? (recommended)`,
initial: getPrefOrDefault('app'),
active: 'Yes',
inactive: 'No',
})
program.app = Boolean(appRouter)
}
}
Since these prompts are repeated and have almost the same code except for the varying arguments, it is possible to refactor these prompts into a function, though I would rather deal with a json object as argument to this function since these function depends on too many params such as argument passed, prompt message, name etc.,
Conclusion:
I found a variable name that was just “tw” instead of styledTw but in other prompts, it is prepended with “styled”. I guess no code is too perfect.
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
Top comments (0)