vite icon indicating copy to clipboard operation
vite copied to clipboard

Add a prompt to opt-in `create-vue`/`create-svelte`... in `create-vite`

Open sodatea opened this issue 1 year ago • 1 comments

Description

Many users come to the Vite world via the simple command npm create vite@latest. As Vite's getting more and more popular, this command has already attracted more traffic than some frameworks' official scaffolding tools. In fact, create-vite now has more weekly downloads than create-vue and create-svelte combined. https://npmtrends.com/create-svelte-vs-create-vite-vs-create-vue

Meanwhile, it aims to be a minimalistic tool, that doesn't involve more advanced setups such as linting, testing, etc.

While the positioning is clear, it is hard to convey in its simple command line interface. Users may not realize its difference from the official ones.

Suggested solution

For each framework, if an official scaffolding tool (that is based on Vite) is available, add one more variant to the template options, named advanced or customize or something else.

For example, the current options for Vue template variants:

? Select a variant: › - Use arrow-keys. Return to submit.
    vue
❯   vue-ts

After:

? Select a variant: › - Use arrow-keys. Return to submit.
    vue
    vue-ts
❯   customize

When selected, the official tool will be used. In the Vue case, it's create-vue.

The tool would be invoked via the same package manager that invoked create-vite. That is, if the user ran pnpm create vite, create-vite would run pnpm create vue for them. This also means the create-vue is downloaded on-the-fly, so that this feature won't hurt the package size of create-vite.

Alternative

No response

Additional context

No response

Validations

sodatea avatar Jul 23 '22 07:07 sodatea

I really like this idea. At one point we discussed adding more hints on the generated HTML and in the readme, but most users won't see it. This is a great way for Vite to offload to each framework the responsibility of creating and maintaining robust starters. Since the maintenance cost isn't much, I wonder if we should let each framework point to other templates too. For example in Vue, it could also list nuxt as an option and fire create-nuxt, which is something that has been requested in the past. In the create-svelte case, that is currently scaffolding a SvelteKit app, so instead of customize, probably kit or SvelteKit would be a better name. For Vue, maybe the options could be: basic-vue, basic-vue-ts, official, nuxt? It is hard to find a good name for create-vue in this context... I don't know if customize is conveying the right info.

patak-dev avatar Jul 23 '22 08:07 patak-dev