Vite 中文文档 Vite 中文文档
指南
GitHub (opens new window)
指南
GitHub (opens new window)
  • vite

    • 指引
    • 为什么选 Vite
    • 开始
    • 功能
    • 命令行界面
    • 使用插件
    • 依赖预构建
    • 静态资源处理
    • 构建生产版本
    • 部署静态站点
    • 环境变量和模式
    • 服务端渲染
    • 后端集成
    • 与其他工具比较
    • 故障排除
    • 从 v3 迁移
  • API

  • 配置参考

  • vite

  • API

  • 配置参考

create-vite-extra


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:

  1. ``` shell
  2. $ npm create vite-extra@latest
  3. ```

With Yarn:

  1. ``` shell
  2. $ yarn create vite-extra
  3. ```

With PNPM:

  1. ``` shell
  2. $ pnpm create vite-extra
  3. ```

With Deno:

  1. ``` shell
  2. $ deno run -A npm:create-vite-extra
  3. ```

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 + SSR + Vue project, run:

  1. ``` shell
  2. # npm
  3. npm create vite-extra@latest my-vue-app -- --template ssr-vue

  4. # yarn
  5. yarn create vite-extra my-vue-app --template ssr-vue

  6. # pnpm
  7. pnpm create vite-extra my-vue-app --template ssr-vue

  8. # Deno
  9. deno run -A npm:create-vite-extra --template deno-vue
  10. ```

Currently supported template presets include:

Template Try online
:--- :---
ssr-vanilla StackBlitz
ssr-vanilla-ts StackBlitz
ssr-vue StackBlitz
ssr-vue-ts StackBlitz
ssr-react StackBlitz
ssr-react-ts StackBlitz
ssr-react-swc
ssr-react-swc-ts
ssr-preact StackBlitz
ssr-preact-ts StackBlitz
ssr-svelte StackBlitz
ssr-svelte-ts StackBlitz
deno-vanilla
deno-vanilla-ts
deno-vue
deno-vue-ts
deno-react
deno-react-ts
deno-react-swc
deno-react-swc-ts
deno-preact
deno-preact-ts
deno-lit
deno-lit-ts
deno-svelte
deno-svelte-ts
library StackBlitz
library-ts StackBlitz
ssr-transform StackBlitz

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

Community Templates


create-vite-extra 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.

  1. ``` shell
  2. npx degit user/project my-project
  3. cd my-project

  4. npm install
  5. npm run dev
  6. ```

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

  1. ``` shell
  2. npx degit user/project#main my-project
  3. ```

Attribution


This project is originally a fork of create-vite. Credit goes to all of it's contributors.
Last Updated: 2023-05-23 11:11:51