
Security News
Deno 2.2 Improves Dependency Management and Expands Node.js Compatibility
Deno 2.2 enhances Node.js compatibility, improves dependency management, adds OpenTelemetry support, and expands linting and task automation for developers.
create-vite
Advanced tools
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.
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
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 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 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.
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 6.x
npm init vite@latest my-vue-app --template vue
# npm 7+, extra double-dash is needed:
npm init vite@latest my-vue-app -- --template vue
# yarn
yarn create vite my-vue-app --template vue
# pnpm
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#main my-project
FAQs
## Scaffolding Your First Vite Project
The npm package create-vite receives a total of 175,766 weekly downloads. As such, create-vite popularity was classified as popular.
We found that create-vite demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Deno 2.2 enhances Node.js compatibility, improves dependency management, adds OpenTelemetry support, and expands linting and task automation for developers.
Security News
React's CRA deprecation announcement sparked community criticism over framework recommendations, leading to quick updates acknowledging build tools like Vite as valid alternatives.
Security News
Ransomware payment rates hit an all-time low in 2024 as law enforcement crackdowns, stronger defenses, and shifting policies make attacks riskier and less profitable.