awesome-vite

https://github.com/naturalspirit-dev/awesome-vite

Last synced: 2 days ago
JSON representation

Get Started
- Templates
  - vitailse - Like Vitesse but with Tailwind CSS.
  - vite-vue2-windicss-starter - Vue 2, Vue Router, Composition API, VueUse, Windi CSS and TypeScript.
  - vite-tailwind - Starter template for Tailwindcss.
  - vite-ts-vue3-todo - Vue3 + TS + Vue-Router4 + Pinia2 template.
  - vue-vite-ssr - Typescript, Eslint, Stylelint, Husky, Lint-staged and Commitlint.
  - vite-ts-vue2-todo - Vue2 + ts + Vue-Router3 + Pinia1 + Composition API.
  - vite-plugin-react-refresh - Provide enhancements for [@vitejs/plugin-react-refresh](https://www.npmjs.com/package/@vitejs/plugin-react-refresh).
  - react-vite-ssr - Mobx, Typescript, Eslint, Stylelint, Husky, Lint-staged and Commitlint.
  - vite-vanilla-tailwind-v3 - Starter template for Tailwindcss and prettier-plugin-tailwindcss build-in.
  - vite-vanilla-ts-lib-starter - Starter for library (CJS, ESM, IIFE) with TypeScript, ESLint, Stylelint, Prettier, Jest, Husky + lint-staged.
  - vite-tailwind-nojs-starter - NoJS Tailwind CSS starter template.
  - vite-tailwind-stimulus-starter - Starter template for Tailwind CSS and Stimulus controllers.
  - docker-vitejs-tailwind-handlebars - Starter template for TailwindCSS and Handlebars (Docker Compose).
  - vite-ts-tailwind-starter - TypeScript, Tailwind CSS, Cypress.io e2e tests + CI.
  - fast-crud - Options-oriented crud framework, developing crud as fast as lightning.
  - vivu - Opinionated scalable vue boilerplate.
  - vite-tauri-template - Tauri + Vite + Vue 3 + Vuetify 3 desktop app template.
  - vue-vite-h5 - Use Vue3, TypeScript and Vant to develop mobile applications.
  - vitespa - Vitesse-based SPA without SSG.
  - vite-quasar-starter - Vite 2.x + Vue 3.x + quasar 2.x starter.
  - vue3-mobile-template - Vue3 + TS + Vue-Router4 + Vuex4 + Vant + Vue-use + Vue-i18n Mobile Template.
  - vue3-template - Vue 3 / Tailwind CSS / vue-router / PNPM / ESlint Airbnb / Stylelint / GitHub pages actions / Netlify.
  - Modern Vue - Modern Vue stack 2022.
  - Vitecamp - Vue3 / Element Plus / Axios / Vue Router / Pinia / Windi CSS / icones / i18n / Markdown / Svg / ESLint Airbnb Style / Components and APIs auto importing.
  - vite-vue3-typescript-webcomponent - Vue 3 / Typescript / boiler plate to develop Web Component.
  - vite-vue-ts-storybook - Vue 3 / i18n / Typescript / Vite / Storybook / ESLint / Prettier.
  - vite-vue-tailwind-v3 - Starter template for Vue3 + TailwindCSS and `prettier-plugin-tailwindcss` build-in.
  - vite-vue-ts-tailwind-v3 - Starter template for Vue3 + Typescript + TailwindCSS and `prettier-plugin-tailwindcss` build-in.
  - vue3-ts-vite-vitest-todo - Vue 3 / TypeScript / Vite / Vitest with full tests / Composition API / Pure TS/TSX.
  - Vue Naive - Admin template, base on Vue 3 + Pinia + Naive UI.
  - vue-admin-box - Admin template, based on Vue 3 + Element-plus.
  - vivu-npm - Starter template to build component library.
  - vue3-pc-template - Vite + ElementPlus + Vue3 + TS + Vue-Router4 + Vuex4 + Vue-use + Vue-i18n PC Template.
  - ViTauri - Vite + Tauri + Vue3 + TS + Vue-Router4 + Auto imports.
  - vue-hbs-admin - Admin starter template based on `Vite` + `Vue3` + `TypeScript` + `Vue-Router4` + `Pinia` + `Unocss` + `Ant-design-vue` + `Auto imports`.
  - vite-vue-proste - Pinia + Typescript + Vue-Router4 + Vitest + Vue-Test-Utils + Vue-Query + Sass + ESLint + Stylelint + Prettier + `project presets`.
  - vue3-powerbuild - Vue 3 + TypeScript + Tailwind CSS + Vite + Storybook + ESLint + Prettier.
  - vue-ts-starter - Vue3 + TypeScript + Vite + Pinia.
  - vitequality - Vue 3 + Typescript + Vue Router + Pinia + Eslint + Jest + Cypress.
  - vue-vite-tw-ts - Vue 3 + Vite + Vitest + Cypress E2E + Naive UI + Pinia + Vue Router.
  - vite-vue-box - Vite + Vue 3 + Ts + TailWindCss + VueHook Plus + Pinia + Axios + ESLint + Stylelint.
  - vite-vue-js-starter-template - Vite + Vue3 + JavaScript + Vue Router + Pinia + TDesign + ESLint + Stylelint + Prettier Simple Template.
  - vite-vue3-bootstrap-ts-vitest-starter - Vue 3 + TypeScript + Vite + Bootstrap Vue 3 + Vitest.
  - vue-xs-admin - Based on Vue3, Vite3 ElementPlus, TypeScript, Pinia, VueRouter.
  - vue-component-template - Vue 3, TSX, ESLint, Prettier.
  - ionic-vue-vite - Vue 3 + Vue Router + Vite + Ionic.
  - ionic-vue-pnpm-monorepo - Vue 3 + Vue Router + Vite + Ionic + pnpm monorepo.
  - ionic-vue-pnpm-express-monorepo - Frontend: Vue 3 + Vue Router + Vite + Ionic, Backend: express + pnpm monorepo.
  - ionic-vue-capacitor - Vue 3 + Vue Router + Vite + Ionic + Capacitor + pnpm monorepo.
  - ultimate-vite-ts-less-template - Vue 3, TypeScript, Less, i18n, Vitest, Vitepress, lodash, Axios, Pinia, Built-in logger, Built-in Input Validators, env files.
  - vite-vue-h5-app - Vite 3 + Vue 3.2 + TypeScript + Vant mobile applications.
  - vulcan - The template for mobile application. Vite, Vue 3, TypeScript, Sass, i18n, Vitest&Cypress, Pinia, APIs&Mock, ESLint, Prettier, auto-importing.
  - vue3-ts-compositionAPI-i18n-fetchData - Vue3 + Typescript + CompositionAPI + i18n + fetchData.
  - vite-vue2-ts-starter - Vue2 TypeScript startar template using vue-property-decorator, vue-router, Vuex.
  - vite-vue2-ts-vuetify-starter - It is the above vite-vue2-ts-starter with Vuetify and its optimized settings. Includes basic templates.
  - vite-vue2-ts-template-starter - Vite + Vue2 + Typescript + Vuex + Vue-router + Axios + Sass Simple Template.
  - vitify-admin - Vuetify admin starter template with full TypeScript support and intellisense of Vuetify components.
  - vite-vue2-js-starter-template - Vite + Vue2 + JavaScript + Vue Router + Vuex + Axios + Less + ESLint + Stylelint + Prettier Simple Template.
  - Vitamin - React TypeScript, TailwindCSS, SPA + PWA, Cypress and CI.
  - vite-reactts-eslint-prettier - React, TypeScript, ESlint, Prettier, Pre-commit.
  - react-vite-admin - React, Recoil, React Query, React Hooks, TypeScript, Axios.
  - vite-template-react - A Create React App-like template.
  - vitejs-template-react-rescript - React + ReScript.
  - template-vite-react - A minimal React Vite starter template.
  - reactjs-vite-tailwindcss-boilerplate - React 18, TypeScript, Jest, Testing Library, TailwindCSS 3, Eslint and Prettier.
  - Tropical - React, Storybook, MDX, Fela, SSR prerendering, and [islands architecture](https://www.npmjs.com/package/tropical-islands).
  - vite-reactts18-chakra-jest-husky - React 18, TypeScript, Chakra UI, Jest, ESLint, Prettier, Husky.
  - react-ts-vite-template - React, TypeScript, Jest, Testing Library, Cypress, ESLint, Prettier, Husky.
  - vite-reactts-tailwind-rtk-eslint - React, TypeScript, Tailwind CSS, Redux Toolkit, eslint.
  - vite-react-ts-tailwind-firebase-starter - Starter using Vite + React + TypeScript + Tailwind CSS (daisyUI) + Firebase (v9) + Prettier + ESLint.
  - vite-react-ts-starter - React, TypeScript, Jest, ESLint, Prettier, TailwindCSS, Husky, Conventional Commits.
  - vital - React, TypeScript, Tailwind (JIT), CSS-Modules, Jest, Atomic Design, Prettier, Husky, Commit-lint.
  - vite-react-ts-ghactions-template - React, TypeScript, Vitest + React Testing Library, GitHub Actions + GitHub Pages, ESLint, Prettier, Husky, Commitlint.
  - vite-react-tailwind-v3 - Starter template for React + TailwindCSS and `prettier-plugin-tailwindcss` build-in.
  - vite-react-ts-tailwind-v3 - Starter template for React + Typescript + TailwindCSS and `prettier-plugin-tailwindcss` build-in.
  - chrome-extension-boilerplate-react-vite - React + TypeScript + SASS + Prettier + ESLint + GitHub Actions + Chrome Extension Manifest v3.
  - vite-rtk-query - React, TypeScript, Redux Toolkit, RTK Query, TailwindCSS, MSW, Jest, React Testing Library, ESLint, Prettier.
  - vite-react-proste - React + TypeScript + `react-router-dom` + Recoil + SASS + Testing Library + `react-query` + ESLint + Stylelint + Prettier.
  - React-PWA - React v18, TypeScript, Vite, React Router v6, MUI v5, Recoil, PWA, Eslint, Prettier, Husky, lint-staged, https localhost and more.
  - vite-react-ts-minimal-template - React + TypeScript + Airbnb ESLint + Prettier + Husky.
  - Viact - React + TypeScript + ESLint + Prettier + Support RTL + mock REST API Viact + Storybook, ErrorBoundary, UnoCss and more.
  - VRTTV - React + TypeScript + TailwindCSS + ESLint + Prettier + Husky + Conventional Commits + Gitmoji + GitHub Actions + Vercel Deploy.
  - React Starter Kit - Jamstack, React, React Router, Material UI, Firebase Auth, TypeScript, ESLint, Prettier, Jest, GitHub Actions.
  - vite-mern-template - React 18 + TypeScript + Vite + Redux Toolkit + ESLint + React Router DOM + Axios + React Icons + React Toastify + Express + Mongoose.
  - react-pipeline - React 18 + TS + AntD + GitHub Pages + Tailwind + Sass + React Router DOM + ESLint.
  - Varsarr - React, Typescript, Styled-Components, Recoil, React-Query, Axios, Absolute imports.
  - viterjs-template - React + JavaScript + Redux + Material UI + Axios + ESLint + Prettier.
  - react-vite-ts-boilerplate - React 18, TypeScript, SCSS, ESLint, Prettier, Vitest.
  - vite-react-universal-template - React18 + TypeScript + `react-router-dom` + Mobx + ESlint + Prettier+Husky, and APIs auto importing.
  - vite-reactts18-eslint-tailwindcss - React 18 + TypeScript + ESLint + TailwindCSS.
  - vite-plugin-react-views - Create routes automatically based on File System.
  - react-vite-template - A react project template.
  - react-xs-admin - The background management system template developed based on React18 + ReactRouteV6 + Vite + And Design + ReactIntl + ReactRedux + Emulation.
  - vite-mui-ts - React + TypeScript + Redux + Material UI + RRD + ESLint + Prettier.
  - leo-react-app - React + SASS | Template for React applications with SASS boilerplate for consistent interfaces.
  - template-vite-react-ts-tailwind - React + TypeScript + Tailwind CSS + Eslint + Prettier.
  - SvelteKit - The fastest way to build Svelte apps.
  - sttv - Svelte, Tailwind CSS, TypeScript.
  - vite-solid - Vite + Solid starter template.
  - vitesse-solid - Opinionated Vite + SolidJS Starter Template. Includes TypeScript, ESLint, Prettier, UnoCSS, HopeUI and more.
  - electron-vite-vue - Electron + Vite + Vue template.
  - electron-vite-react - Electron + Vite + React template.
  - electron-vite-quick-start - Full stack uses Vite to run Electron application, including main process.
  - electron-vite-template - Electron 13, Vue 3 and TypeScript. Make your desktop development easier.
  - fast-vite-electron - Vue3 + Vite + Electron with esbuild.
  - fast-vite-nestjs-electron - Vue3 + Vite + Electron + Nestjs with esbuild.
  - vite-reactts-electron-starter - React, Tailwind CSS, TypeScript and Electron.
  - vite-plugin-electron-renderer - Support use Node.js API in Electron-Renderer.
  - electron-vue-template - Electron template with TypeScript, including Electron Builder.
  - Vitron - Build beautiful (win, linux, mac) desktop apps for modern web projects with vite and electron.
  - Vutron - Electron + Vite + Vue 3 + Pinia (TypeScript) template.
  - vite-elm-template - A default template for building Elm applications.
  - vite-elm-spa - An unopinionated template for building Elm single page applications.
  - vite-petite-vue-starter - Starter template.
  - P5.js Starter Template - Templates for creating P5.js sketches.
  - 11st-Starter-Kit - 11ty, powered by Vite with Tailwind CSS and Alpine.js.
  - stravital - TypeScript, Git Hooks, Commitizen, Lint Staged, TailwindCSS.
  - vue-pure-admin - Background management template based on Vue3, TypeScript, Tailwind CSS, element-plus.
  - Vitesome - Vue3 + TypeScript + WindiCSS + Vue Router 4, i18n and Iconify.
  - vue3-vant-mobile - Vite + Vue3 + Vant4 + Pinia + Vue-Router4 + TypeScript Mobile Template.
  - vite-react-tailwind-template - React 17, TypeScript, Jest, ESLint, Prettier, Husky, Tailwind CSS, PostCSS, pnpm.
  - vite-react-ts-extended - React, TypeScript, TailwindCSS, MSW, Axios, Jest, React Testing Library, ESLint, Prettier, GitHub Actions.
  - vite-react-starter - React + ESLint + Prettier + SASS + Emotion + TailwindCSS + Jest + Testing Library.
  - vite-ant-design-pro - React + antd + ProComponents + ReactQuery + ReactRouter6.
  - Viterts - React + TypeScript + Redux + React Router + Jest + ESLint + Airbnb + Prettier + SASS.
  - ViteRC - React 18 + TypeScript + ESLint (Airbnb) + Prettier + Husky + Jest + Absolute imports + Commit linting.
  - svelte-vite-ssr - Svelte with SSR support.
  - Vitesse - Opinionated starter template.
  - vue-vben-admin - Background management template based on Vue3, Ant-Design-Vue, TypeScript.
  - vitesse-lite - Lightweight version of Vitesse.
  - vitesse-webext - WebExtension Vite Starter Template.
  - naive-ui-dashboard-template - UI friendly, Vue 3 + TSX + TailwindCSS 2 JIT + PostCSS + Naive UI.
  - vue3-tailwind3-website-starter - Vue3 / Vite / TailwindCSS website starter template, with guides on each page.
  - vite-boot - Vite + Vue3 + TypeScript + Vue-Router4 + Pinia + Tailwind CSS + VueUse Template.
  - electron-vite-boilerplate - Support SerialPort, SQLite3 and node C/C++ addons.
  - vite-plugin-electron-quick-start - Template for Electron projects.
  - vite-electron-builder - Electron apps using Vite for both back and front-end, with automatic releases.
  - Vitectron - TypeScript & JSX + Vue 3.x + Vite 2.x + Pinia 2.x + Vue-Router 4.x.
  - vite-electron-plugin - High-performance, esbuild-based Vite Electron plugin.
  - vit-singlefile-gzip - Starter template for embedded.
  - chrome-ext-template-preact-windi-vite - Preact, Windi CSS, TypeScript, Prettier, ESLint, GitHub Actions and Chrome Extension Manifest v3.
  - elm_vite_tailwind_template - Opinionated template for building Elm web apps using Tailwind CSS and Daisy UI.
- Official Resources
  - create-vite - Scaffolding Your First Vite Project.
  - create-vitawind - Scaffolding for TailwindCSS project.
  - create-electron-vite - Scaffolding Your Electron + Vite Project.
  - create-vite-app - Scaffolding Your Out Of The Box Vite Project.
  - create-nx-workspace - Scaffolding a Nx + React + Vite + Vitest.
Plugins
- Vue
  - v3 - Server-side generation.
  - v3 - Official Vue 3 support.
  - v3 - Official Vue 3 JSX support.
  - v3 - Integration for Vue I18n.
  - v2 - Vue 2 integration.
  - v23 - File system based route generator.
  - v3 - A tool to generate routes.
  - v23 - Markdown as Vue components / Vue components in Markdown.
  - v3 - Load SVG files as Vue components.
  - v2 - Load SVG files as Vue components.
  - v3 - Load SVG files as a Vue component, supporting svg file HMR and Typescript intelligence prompt.
  - v3 - Load i18n translation message files.
  - v3 - GraphQL Tags for your Vue SFC.
  - v2 - Compatible without '.vue' suffix.
  - v23 - Jump to local IDE source code while click the element of browser.
  - v23 - Serve ".vue" files as static assets.
  - v2 - Enabling `<script setup>` syntax for Vue 2.
  - v3 - Markdown code preview.
  - v23 - On-demand components auto-importing.
- Framework-agnostic Plugins
  - @vitejs/plugin-legacy - Legacy browser support.
  - vite-esbuild-typescript-checker - Type checker (TypeScript, Vue SFC, etc.) based on the webpack 5 plugin.
  - vite-plugin-cp - Copy files after building bundles.
  - vite-plugin-require-context - Supports `require.context`.
  - vite-plugin-commonjs - Support CommonJS to ESM.
  - vite-plugin-content - Convert `yaml`, `xml`, `ini`, `toml`, `csv`, `plist` and `properties` files to ES6 modules.
  - vite-plugin-global-style - Deal with global styles for CSS, SASS, LESS and Stylus.
  - @import-meta-env/unplugin - Inject environment variables into the `import.meta.env` object after building the application instead of statically replacing it during production.
  - vite-plugin-external - Provides a way of excluding dependencies from the runtime code and output bundles.
  - vite-plugin-watch-and-run - Watch some files (glob) and trigger a command. To enable any tool to have a watch mode.
  - vite-plugin-mock-data - Provides a simple way to mock data.
  - vite-plugin-reverse-proxy - Sometimes we have to redirect scripts on production environment to debug and solve problems, the plugin will transform the script to be served with the `text/javascript` MIME type to `module` MIME type.
  - vite-plugin-windicss - Windi CSS integration.
  - vite-plugin-node - Integration with Node.js backend servers.
  - vite-plugin-cesium - Integration with Cesium library.
  - vite-plugin-mpa - Out-of-box multi-page application (MPA) integration.
  - vite-plugin-linter - Extensible linter framework that shows the linting output in the Vite output and the browser console, includes ESLint & TypeScript ootb.
  - vite-plugin-checker - Fast run checkers (TypeScript/VLS/vue-tsc, etc.) in worker threads with overlay and terminal hint.
  - @nabla/vite-plugin-eslint - Runs ESLint asynchronously in a worker to keep HMR fast.
  - vite-plugin-tauri - Integrate Tauri in a Vite project to build cross-platform apps.
  - vite-plugin-federation - Support Module Federation, Inspired by Webpack Module Federation feature.
  - vite-plugin-wasm-pack - Integration with rust [wasm-pack](https://github.com/rustwasm/wasm-pack), the simple way.
  - vite-plugin-comlink - Use WebWorkers with the power of [Comlink](https://github.com/GoogleChromeLabs/comlink) to make them enjoyable.
  - vite-plugin-sass-dts - This is a plugin that automatically creates a type file when using the CSS module type-safely.
  - vite-plugin-simple-gql - Easily import .graphql and .gql files.
  - vite-plugin-ali-oss - Upload the production files bundled in the project to Ali OSS, except for HTML.
  - vite-plugin-webfont-dl - Downloads and injects webfonts (Google Fonts) to improve website's performance.
  - vite-plugin-babel - Babel integration for both build and server to support f.ex. decorators or class fields in pure JS/JSX files.
  - vite-plugin-resolve - Custom resolve module content.
  - vite-plugin-electron - Integrate Vite and Electron.
  - vite-plugin-optimizer - Manually Pre-Bundling.
  - vite-plugin-dynamic-import - Enhance Vite builtin dynamic import.
  - vite-plugin-esmodule - Build ES module to CommonJs module for Node.js.
  - vite-plugin-dynamic-import-module - Support for dynamic import module with variables.
  - vite-plugin-mp - Configure multi-pages applications and code splitting.
  - vite-plugin-babel-compiler - The plugin works with Babel compiler.
  - vite-plugin-commonjs - A pure JavaScript implementation for CommonJs.
  - vite-plugin-mpa-plus - More flexible MPA (multi-page application) supports html templates, path rewriting.
  - vite-plugin-tencent-oss - Upload the production files bundled in the project to Tencent OSS, except for HTML.
  - vite-plugin-multi-pages - Multi Pages Support，can build src/pages anyPage，can set prefixName.
  - vite-plugin-html-template-mpa - Multi Pages Common template support.
  - vite-plugin-vconsole-mpa - Multi Pages Vconsole supports，simple config.
  - vite-plugin-browser-sync - BrowserSync.
  - vite-plugin-jspm - Resolves dependencies independently from CDN providers using import maps and es-module-shims.
  - vite-plugin-print-urls - Vite hmr and page reload will print server urls.
  - vite-plugin-env-switch - Switch project env and restart vite server without command line operation.
  - vite-plugin-msg-log - Log the msg you want to confirm frequently (like env info) when HMR.
  - vite-plugin-bullet-msg - Get the target strings in you source code and show them in browser(or handle them yourself).
  - vite-plugin-virtual-mpa - Out-of-box MPA plugin, with html template engine and virtual files support, which generate multiple files using only one template.
  - tailwindcss-vite-plugin - Tailwind CSS integration.
  - vite-plugin-assemblyscript-asc - AssemblyScript integration with full support for HMR, ESM import bindings, and source maps.
  - vite-plugin-solid-markdown - A vite plugin for compiling markdown files to solid components.
  - vite-plugin-qiniu-oss - Upload the production files bundled in the project to qiniu OSS, except for HTML.
  - vite-plugin-stylelint - Runs Stylelint synchronously/asynchronously.
  - Vite-plugin-graphiql - Integrattion for GraphiQL IDE.
  - vite-plugin-graphql-server - Bootstrap a local GraphQL server for testing and documentaion.
  - vite-plugin-radar - All in one analytics loader (with 7+ providers supported).
  - vite-plugin-monaco-editor - Monaco Editor integration.
  - vite-plugin-image-presets - Define presets to automatically create and optimize responsive images.
  - vite-plugin-import-rewriter - Rewriter the import based on conditions.
  - vite-plugin-xml-loader - Loads xml file as JSON.
  - vite-plugin-glsl - Import shader file chunks.
  - vite-plugin-svgo - Load SVGs as plain string and transform with SVGO library.
  - vite-plugin-remark-rehype - Loads and transform markdown files using the unified ecosystem.
  - vite-plugin-gltf - Load, transform, optimize, and compress glTF 3D files.
  - vite-plugin-importer - Integration for babel-plugin-import.
  - vite-plugin-banner - Adds a banner to the top of each generated chunk.
  - rollup-plugin-critical - Generate critical CSS.
  - vite-plugin-dts - Generate declaration files from `.ts` or `.vue` source files for lib.
  - vite-plugin-chunk-split - Automatically code splitting, support unbundle in production.
  - vite-plugin-static-copy - Copy files and folders.
  - vite-plugin-copy-files - Move files to the location of the corresponding package directory.
  - vite-plugin-progress - Display with progress bar when building.
  - vite-plugin-importus - Modularly import plugin, compatible with antd, lodash, material-ui and so on.
  - vite-plugin-build - Transfom the whole folder in library mode.
  - vite-plugin-zip-file - Compress files or folders into zip.
  - vite-plugin-zip-pack - Pack distribution/build folder into a zip file.
  - unplugin-compression - Compress dist to zip, tar, taz.
  - vite-plugin-image-optimizer - Optimize (compress) your image assets using Sharp.js and SVGO at build time.
  - vite-plugin-ts-nameof - Ability to resolve [nameof](https://github.com/dsherret/ts-nameof) in TypeScript.
  - vite-plugin-handlebars - Process HTML files with Handlebars.
  - vite-plugin-html-config - HTML tag configuration, such as script link style meta favicon and more.
  - vite-plugin-html-template - HTML template, like `html-webpack-plugin` for Webpack.
  - vite-plugin-require - A Vite plugin that supports `require` by code transforming.
  - vite-plugin-shared-modules - Share node_modules in monorepos.
  - vite-plugin-require-transform - Converts the code from require syntax to import.
  - vite-plugin-twig - Twig template engine support.
  - vite-plugin-stache - CanJS's template engine. Transforms `stache` files and template strings.
  - vite-plugin-pug-transformer - Pug template engine support.
  - vite-plugin-load-css-module - Support custom regexp of css modules and use vite internal css plugin, not just `.module.xxx`.
  - vite-plugin-remain-exports - Remaining exports from the entry file that imported by html.
  - vite-plugin-unocss-to-uni - `UnoCSS` in `uni-app`.
  - @modyfi/vite-plugin-yaml - Transform YAML files to ESM with schema validation and error reporting.
  - vite-plugin-head - Modify, add, delete `Metadata` in the head element.
  - vite-plugin-html-env - Injection of environment variables in `index.html`.
  - vite-plugin-html-inject - Split the `index.html` into smaller reusable pieces.
  - vite-plugin-inject-preload - Inject `<link rel="preload">` to your `index.html` based on your build assets.
  - vite-plugin-document - Use `Document.tsx` as html template.
  - @vituum/vite-plugin-handlebars - Handlebars template engine support, transforms `.hbs` templates to `.html`.
  - @vituum/vite-plugin-pug - Pug template engine support, transforms `.pug` templates to `.html`.
  - @vituum/vite-plugin-nunjucks - Nunjucks template engine support, transforms `.njk` templates to `.html`.
  - @vituum/vite-plugin-liquid - Liquid template engine support, transforms `.liquid` templates to `.html`.
  - @vituum/vite-plugin-twig - Twig template engine support, transforms `.twig` templates to `.html`.
  - @vituum/vite-plugin-latte - Latte template engine support, transforms `.latte` templates to `.html`.
  - @vituum/vite-plugin-posthtml - PostHTML support, transforms syntax to `.html`.
  - @vituum/vite-plugin-juice - Juice support, transforms `.css` to inline styles in `.html`.
  - vite-plugin-setting-css-module - Implementing CSS-Modules with vite modularity rules. Don't need create `xxx.module.css`.
  - vite-plugin-version-mark - Automatically use `package version` / `git commit` / `custom` to be inserted into your project as a unique identifier for the project version.
  - vite-plugin-css-export - Export variables from CSS to JS, and support nested rules.
  - vite-plugin-optimize-css-modules - Generate the smallest possible CSS-Classes when CSS-Modules are used.
  - Vite-plugin-haxe - Use Haxe when targeting JS, transforming `.hxml`.
  - vite-tsconfig-paths - Support for TypeScript's path mapping.
  - vite-aliases - Alias auto-generation based on project structure.
  - vite-plugin-imp - Import library component styles on demand, make your app slimmer.
  - vite-plugin-mkcert - Provide certificates https dev server.
  - vite-plugin-vconsole - Help developers use vconsole to facilitate mobile development and debugging.
  - vite-plugin-externals - Exclude dependencies from the output bundles.
  - vite-plugin-mock-server - Mock server plugin, support using TS and JS to write Mock API and HMR.
  - vitawind - Install and Setting Tailwind CSS automatically.
  - vite-plugin-restart - Restart the Vite server on file changes.
  - vite-plugin-full-reload - Reload the browser on file changes.
  - vite-plugin-tips - Provide better development server status tips on the page.
  - @zougt/vite-plugin-theme-preprocessor - Easily implementing dynamic themes based on LESS or SASS.
  - vite-plugin-remove-console - A vite plugin that deletes console.log in the production environment.
  - vite-plugin-dev-manifest - Generates `manifest.dev.json` during dev server, for backend integration with any language/framework.
  - vite-plugin-dynamic-base - Resolve all resource files dynamic publicPath.
  - vite-plugin-redirect - Redirect server requests.
  - vite-plugin-live-reload - Live reloading.
  - vite-plugin-simple-vconsole - A debug console view inside your app to make mobile debugging easier, for both SPA and MPA.
  - vite-plugin-file-mock - File system based local mock plugin.
  - vite-plugin-qrcode - Show QR code on server start.
  - vite-plugin-cem - Generates `custom-elements.json` manifest for describing custom elements.
  - vite-plugin-web-update-notification - Detect webpage updates and notify user to reload. support vite and umijs.
  - vite-plugin-autogeneration-import-file - Automatically generates import file.
  - vite-plugin-browserslist-useragent - Compile browserslist query to a RegExp to test browser useragent.
  - vite-plugin-validate-env - Validate your environment variables at build time. Never forget an environment variable again.
  - vite-plugin-patch-env - Patch environment variables from the system into Vite.
  - vite-plugin-conditional-compile - Conditional compilation syntax based on environment variables.
  - vite-plugin-debug - Base on specific url parameters dynamically enables mobile web page debugging.
  - vite-plugin-mock-dev-server - Mock server for development, support CJS/ESM/JSON, auto-importing file and HMR.
  - vite-plugin-externals-extension - External links plugin which supports ESM and UMD.
  - vite-plugin-shortcuts - Add additional customized shortcut key population.
  - vite-plugin-entry-shaking - Mimic tree-shaking behaviour when importing code from an entry file in development mode.
  - vite-plugin-auto-alias - Automatically generate alias based on path.
  - vite-plugin-image-placeholder - Generate placeholder images by path matches.
  - mocha-vite-puppeteer - Run your Mocha front-end tests with the Vite bundler and the Puppeteer browser launcher.
  - vitest - A Vite-native test framework.
  - vitest-mock-extended - Type safe mocking extensions for Vitest.
  - cypress-vite - Run Cypress specs using Vite.
  - vitest-preview - Visual debugging experience for Vitest.
  - vite-plugin-html - Plugin to minimize and use ejs template syntax in `index.html`.
  - vite-plugin-virtual-html - Make Vite MPA consistent with `@vue/cli`.
  - vite-plugin-theme - Dynamically changing the theme color.
  - unplugin-auto-import - On-demand API auto-importing.
  - vite-plugin-inspect - Inspect the intermediate state of Vite plugins.
  - unplugin-icons - Access thousands of icons as components.
  - vite-plugin-unocss-to-uni - `UnoCSS` in `uni-app`.
  - vite-plugin-pwa - Zero-config PWA.
  - vite-plugin-rsw - Load rust-compiled (wasm-pack) WebAssembly packages.
  - vite-imagetools - Load and transform images using url query parameters.
  - vite-compression-plugin - Use Node.js stream compress file to gzip or more.
  - unplugin-imagemin - High performance compressed Picture based on squoosh and sharp.
  - vite-plugin-api - Generate route mapping for API Routes services from the directory tree.
- React
  - @vitejs/plugin-react - The all-in-one Vite plugin for React projects.
  - vite-preset-react - All in one preset for your React app - HMR, Automatic React inject, removal of DevTools in prod.
  - vite-plugin-svgr - Transform SVGs into React components.
  - vite-plugin-react-pages - A Vite framework for building React app.
  - @vitjs/vit - React application framework inspired by UmiJS.
  - vite-plugin-react-inspector - Jump to local IDE source code while click the element of browser.
  - vite-plugin-react-click-to-component - Uses Vite's launch middleware to enable alt+click to go to component.
- Angular
  - @nxext/angular-vite - A plugin that uses SWC to compile Angular modules.
- Rollup Plugins
  - Vite Rollup Plugins - Compatibility list for official rollup plugins.
  - @rollup/plugin-babel - Compile your files with Babel.
  - @rollup/plugin-buble - Compile ES2015 with buble.
  - @rollup/plugin-data-uri - Import modules from Data URIs.
  - @rollup/plugin-html - Create HTML files to serve Rollup bundles.
  - @rollup/plugin-node-resolve - Locate and bundle third-party dependencies in node_modules.
  - @rollup/plugin-sucrase - Compile TypeScript, Flow, JSX, etc with Sucrase.
  - @rollup/plugin-typescript - Integration between Rollup and TypeScript.
  - @rollup/plugin-wasm - Import WebAssembly code with Rollup.
  - @rollup/plugin-url - Import files as data-URIs or ES Modules.
  - @rollup/plugin-beep - System beeps on errors and warnings.
  - @rollup/plugin-legacy - Add export declarations to legacy non-module scripts.
  - @rollup/plugin-replace - Replace strings in files while bundling.
  - @rollup/plugin-strip - Remove debugger statements and functions from your code.
  - rollup-plugin-graphql-codegen - Generating type definitions for GraphQL tag template strings in worker_threads.
  - rollup-plugin-i18next-dts-gen - Generating type definitions from i18n JSON files are used for code hinting and validation.
  - Awesome Rollup list - maintained rollup plugins, and refer to the Vite docs section about [rollup plugin compatibility](https://vitejs.dev/guide/api-plugin.html#rollup-plugin-compatiblity).
  - @rollup/plugin-image - Import JPG, PNG, GIF, SVG, and WebP files (needs `enforce: 'pre'`).
  - @rollup/plugin-inject - Scan modules for global variables and injects import statements where necessary.
  - @rollup/plugin-virtual - A Rollup plugin that loads virtual modules from memory.
  - @rollup/plugin-yaml - Convert YAML files to ES6 modules.
  - @rollup/plugin-alias - Define and resolve aliases for bundle dependencies.
  - @rollup/plugin-commonjs - Convert CommonJS modules to ES6.
  - @rollup/plugin-dynamic-import-vars - Resolving dynamic imports that contain variables.
  - @rollup/plugin-json - Convert `.json` files to ES6 modules.
  - @rollup/plugin-dsv - Convert `.csv` and `.tsv` files into JavaScript modules with d3-dsv.
  - @rollup/plugin-eslint - Verify entry point and all imported files with ESLint.
  - @rollup/plugin-graphql - Convert .gql/.graphql files to ES6 modules.
- Preact
  - @preact/preset-vite - Preact preset. HMR, automatic Preact inject, removal of DevTools in prod.
- Svelte
  - vite-plugin-svelte - Adds Svelte support. Official plugin of Svelte team.
- Elm
  - vite-plugin-elm - A plugin that enables you to compile an Elm module.
- Electron
  - electron-vite - An Electron CLI integrated with Vite.
  - vite-plugin-electron-config - Electron plugin for Vite, support for main process, renderer process and preload script.
- Solid
  - vite-plugin-solid - Provides JSX transformation for Solid.
Resources
- Official Resources
Integrations with Backends
- Flask
  - Flask-Vite - Integration with Flask.
- Ruby on Rails
  - vite-plugin-ruby - Configuration for Ruby backends.
  - Vite Ruby - Integration for Rails, Hanami, Padrino, and Rack apps.
- Adobe Experience Manager
  - AEM Vite - Integration for Adobe Experience Manager and AEM SDK.
- Craft CMS
  - Craft Vite - Plugin for integration with Craft CMS.
- Django
  - django-vite - Integration for Django applications.
- Laravel
  - Laravel Vite - Integration for the Laravel framework.
  - Laravel Livewire Plugin - Enable hot reloading of Laravel Livewire components without losing state.
  - Laravel Vite Plugin - Laravel official plugin for Vite.
- WordPress
  - wordpress-vite-assets - Integration for WordPress themes.
- Go
  - vite-go - Integration for Golang web apps.
- Rust
  - create-rust-app - Integration for Rust web apps.
- OctoberCMS
  - Vitewind - Integration for OctoberCMS.
- Symfony
  - Vite Bundle - Integration for Symfony.
- DDEV
  - ddev-viteserve - Add-on for running Vite in the PHP-oriented dev environment DDEV.
- Node.js
  - vite-express - Integration for Express web apps.
- Shopify
  - vite-plugin-shopify - Integration for Shopify themes.
- CodeIgniter
  - codeigniter-vite - Integration for CodeIgniter.
- CakePHP
  - cakephp-vite - Integration for CakePHP.
Migrations
- React
  - CRA migration guide - A step-by-step guide for migrating a project from Create React App.
  - CRA to Nx + Vite tool - An automated tool to convert a Create React App project to use Nx + Vite + Vitest.
- Vue CLI
  - vue-cli-plugin-vite - Use Vite on Vue CLI with minimize codebase modifications.
  - webpack-to-vite - Convert a webpack project to vite project, also provides conversion details to help you migrate smoothly.
SSR
- Libraries
  - vite-ssr - Simplified Server Side Rendering with an SPA-like developer experience. ![react] ![vue3]
  - ssr - A Server Side Rendering framework combined with Webpack/Vite. ![react] ![vue3] ![vue2]
  - vavite - A tool for developing and building server-side applications with live reloading capabilities.
  - vite-plugin-ssr - Like Nuxt/Next.js but as a do-one-thing-do-it-well plugin. ![react] ![vue3] ![vue2] ![svelte]
- Frameworks
  - vitedge - Edge-side rendering with fullstack utilities. ![react] ![vue3]
  - vitext - The Next.js like React framework for better User & Developer experience. ![react]
  - Rakkas - React framework inspired by Next.js and SvelteKit. ![react]
Projects Using Vite.js
- Open Source
  - VitePress - Static Site Generator powered by Vite and Vue.
  - TroisJS - Three.js integration with Vite and Vue 3.
  - Slidev - Presentation Slides for Developers.
  - îles - Islands of Interactivity with Vue3, multi-framework.
  - Astro - Modern Static Site Builder.
  - Nhost - Nhost is an Open Source Firebase Alternative with GraphQL.
  - Ladle - Tool for developing and testing component stories powered by Vite and React.
  - IslandJS - Static site generator base on islands architecture.
  - Vituum - Wrapper around Vite with predefined config, integrations and template engines.
  - Hathora - Multiplayer game framework.
  - Compiiile - Preview or host folders containing Markdown files with full-text search and presentation slides.
- Apps/Websites
  - Awesome CN Café - Web application for Awesome CN Café.
  - Todo Example - Todo app with routing and state management.
  - npmview - A web application to view npm package files.
  - Layoutit Grid - Interactive CSS Grid layout generator.
  - vue3-realworld-example-app - Realworld app implementation using Vue 3 + TypeScript + Composition API.
  - react-device-frameset - This is yet another device frameset component for React.
  - vite-vue3-lowcode - Low code platform using Vue 3 + TypeScript + Composition API.
  - Context Note - A note-taking chrome extension built by Vue3 & Vite.
  - react-keyboard-navigator - A suite of React components and hook for selecting from sibling components through the keyboard.
  - pointer-lock-movement - A pointer lock movement manager for customizing your own creative UI.
  - Icônes - Icon explorer with instant search.
  - macOS in Svelte - macOS Desktop experience for Web in Svelte.

Programming Languages

TypeScript 216 JavaScript 52 Vue 22 HTML 8 PHP 5 CSS 4 Elm 3 Handlebars 1 Swift 1 ReScript 1

awesome-vite

Get Started

Templates

Official Resources

Plugins

Vue

Framework-agnostic Plugins

React

Angular

Rollup Plugins

Preact

Svelte

Elm

Electron

Solid

Resources

Official Resources

Integrations with Backends

Flask

Ruby on Rails

Adobe Experience Manager

Craft CMS

Django

Laravel

WordPress

Go

Rust

OctoberCMS

Symfony

DDEV

Node.js

Shopify

CodeIgniter

CakePHP

Migrations

React

Vue CLI

SSR

Libraries

Frameworks

Projects Using Vite.js

Open Source

Apps/Websites