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.
create-vite
Scaffolding Your First Vite Project
Compatibility Note:
Vite requires Node.js version >=12.0.0.
With NPM:
$ npm init vite@latest
With Yarn:
$ yarn create vite
With PNPM:
$ pnpm dlx 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 init vite@latest my-vue-app --template vue
npm init vite@latest my-vue-app -- --template vue
yarn create vite my-vue-app --template vue
pnpm dlx 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
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