create-vite

What is create-vite?

The create-vite npm package is a tool for quickly scaffolding a new Vite project. Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects. The create-vite package allows you to set up a new project with a variety of templates and configurations, making it easier to get started with Vite.

What are create-vite's main functionalities?

Create a new Vite project

This command initializes a new Vite project in a directory named 'my-vite-app'. It sets up the basic structure and configuration files needed to start developing with Vite.

npx create-vite@latest my-vite-app

Choose a template

This command initializes a new Vite project using a specific template, in this case, a React template. Vite supports various templates like vanilla, vue, react, preact, lit, and more.

npx create-vite@latest my-vite-app --template react

Interactive project setup

Running this command without additional arguments will start an interactive prompt where you can choose the project name and template interactively. This is useful for users who prefer a guided setup process.

npx create-vite@latest

Other packages similar to create-vite

create-react-app

Create React App is a tool for setting up a new React project with a single command. It provides a similar experience to create-vite but is specifically tailored for React projects. Unlike Vite, Create React App uses Webpack as its build tool.

vue-cli

Vue CLI is a standard tooling for Vue.js development. It offers a similar project scaffolding experience to create-vite but is specifically designed for Vue.js projects. Vue CLI provides a more extensive set of features and plugins compared to Vite's simpler setup.

parcel

Parcel is a web application bundler that offers a zero-configuration setup similar to Vite. It aims to provide a fast and easy development experience but is more general-purpose and not tied to any specific framework like Vite is with its templates.

README

create-vite

Scaffolding Your First Vite Project

Compatibility Note: Vite requires Node.js version 14.18+, 16+. However, some templates require a higher Node.js version to work, please upgrade if your package manager warns about it.

With NPM:

$ npm create vite@latest

With Yarn:

$ yarn create vite

With PNPM:

$ pnpm create vite

Then follow the prompts!

You can also directly specify the project name and the template you want to use via additional command line options. For example, to scaffold a Vite + Vue project, run:

# npm 6.x
npm create vite@latest my-vue-app --template vue

# npm 7+, extra double-dash is needed:
npm create vite@latest my-vue-app -- --template vue

# yarn
yarn create vite my-vue-app --template vue

# pnpm
pnpm create vite my-vue-app --template vue

Currently supported template presets include:

• vanilla
• vanilla-ts
• vue
• vue-ts
• react
• react-ts
• preact
• preact-ts
• lit
• lit-ts
• svelte
• svelte-ts

You can use . for the project name to scaffold in the current directory.

Community Templates

create-vite is a tool to quickly start a project from a basic template for popular frameworks. Check out Awesome Vite for community maintained templates that include other tools or target different frameworks. You can use a tool like degit to scaffold your project with one of the templates.

npx degit user/project my-project
cd my-project

npm install
npm run dev

If the project uses main as the default branch, suffix the project repo with #main

npx degit user/project#main my-project