feat(create-vite): add help usage

packages/create-vite/__tests__/cli.spec.ts

@@ -103,3 +103,15 @@ test('accepts command line override for --overwrite', () => {
  const { stdout } = run(['.', '--overwrite', 'ignore'], { cwd: genPath })
  expect(stdout).not.toContain(`Current directory is not empty.`)
 })
+
+test('return help usage how to use create-vite', () => {
+ const { stdout } = run(['--help'], { cwd: __dirname })
+ const message = 'Usage: create-vite [OPTION]... [DIRECTORY]'
+ expect(stdout).toContain(message)
+})
+
+test('return help usage how to use create-vite with -h alias', () => {
+ const { stdout } = run(['--h'], { cwd: __dirname })
+ const message = 'Usage: create-vite [OPTION]... [DIRECTORY]'
+ expect(stdout).toContain(message)
+})

packages/create-vite/src/index.ts

@@ -20,11 +20,36 @@ import {
 // Avoids autoconversion to number of the project name by defining that the args
 // non associated with an option ( _ ) needs to be parsed as a string. See #4606
 const argv = minimist<{
- t?: string
  template?: string
-}>(process.argv.slice(2), { string: ['_'] })
+ help?: boolean
+}>(process.argv.slice(2), {
+ default: { help: false },
+ alias: { h: 'help', t: 'template' },
+ string: ['_'],
+})
 const cwd = process.cwd()
 
+// prettier-ignore
+const helpMessage = `\
+Usage: create-vite [OPTION]... [DIRECTORY]
+
+Create a new Vite project in JavaScript or TypeScript.
+With no arguments, start the CLI in interactive mode.
+
+Options:
+ -t, --template NAME use a specific template
+
+Available templates:
+${yellow ('vanilla-ts vanilla' )}
+${green ('vue-ts vue' )}
+${cyan ('react-ts react' )}
+${cyan ('react-swc-ts react-swc')}
+${magenta ('preact-ts preact' )}
+${lightRed ('lit-ts lit' )}
+${red ('svelte-ts svelte' )}
+${blue ('solid-ts solid' )}
+${lightBlue('qwik-ts qwik' )}`
+
 type ColorFunc = (str: string | number) => string
 type Framework = {
  name: string
@@ -251,6 +276,12 @@ async function init() {
  const argTargetDir = formatTargetDir(argv._[0])
  const argTemplate = argv.template || argv.t
 
+ const help = argv.help
+ if (help) {
+ console.log(helpMessage)
+ return
+ }
+
  let targetDir = argTargetDir || defaultTargetDir
  const getProjectName = () =>
  targetDir === '.' ? path.basename(path.resolve()) : targetDir