UNPKG

unplugin-vue

Version:
162 lines (115 loc) 4.09 kB
# unplugin-vue [![npm](https://img.shields.io/npm/v/unplugin-vue.svg)](https://npmjs.com/package/unplugin-vue) [![Unit Test](https://github.com/unplugin/unplugin-vue/actions/workflows/unit-test.yml/badge.svg)](https://github.com/unplugin/unplugin-vue/actions/workflows/unit-test.yml) Transform Vue 3 SFC to JavaScript. ## Features - ⚡️ Support Vite, Webpack, Vue CLI, Rollup, esbuild and more, powered by [unplugin](https://github.com/unjs/unplugin). - ✨ Support `<script setup>` and macros. - 🔥 Hot module replacement (HMR) support for Vite. - 🔄 Sync code from [@vitejs/plugin-vue](https://github.com/vitejs/vite-plugin-vue/tree/main/packages/plugin-vue) periodically. Currently based on [@vitejs/plugin-vue@6.0.0](https://github.com/vitejs/vite-plugin-vue/tree/plugin-vue@6.0.0/packages/plugin-vue). ## Installation ```bash npm i -D unplugin-vue ``` <details> <summary>Vite</summary><br> ```ts // vite.config.ts import Vue from 'unplugin-vue/vite' export default defineConfig({ plugins: [Vue()], }) ``` <br></details> <details> <summary>Rollup</summary><br> ```ts // rollup.config.js import Vue from 'unplugin-vue/rollup' export default { plugins: [Vue()], } ``` <br></details> <details> <summary>Rolldown</summary><br> ```ts // rolldown.config.js import Vue from 'unplugin-vue/rolldown' export default { plugins: [Vue()], } ``` <br></details> <details> <summary>esbuild</summary><br> ```ts import { build } from 'esbuild' import Vue from 'unplugin-vue/esbuild' build({ plugins: [Vue()], }) ``` <br></details> <details> <summary>Webpack</summary><br> ```js // webpack.config.js import Vue from 'unplugin-vue/webpack' export default { /* ... */ plugins: [Vue()], } ``` <br></details> <details> <summary>Rspack</summary><br> ```ts // rspack.config.js import Vue from 'unplugin-vue/rspack' export default { /* ... */ plugins: [Vue()], } ``` <br></details> <details> <summary>Farm</summary><br> ```ts // farm.config.ts import Vue from 'unplugin-vue/farm' export default { /* ... */ plugins: [Vue()], } ``` <br></details> ### Limitations ⚠️ HMR is not supported for Webpack, Vue CLI, and Rspack. ## Who is using - [Vue Macros](https://github.com/vue-macros/vue-macros) - Explore and extend more macros and syntax sugar to Vue. - [Vue DevTools](https://github.com/vuejs/devtools) - ⚙️ Browser devtools extension for debugging Vue.js applications. - [Element Plus icon](https://github.com/element-plus/element-plus-icons) - [Onu UI](https://github.com/onu-ui/onu-ui) - Opinionated and lightweight UnoCSS ui library. - [vue-components-lib-seed](https://github.com/zouhangwithsweet/vue-components-lib-seed) - A vue3.0 components library template. ## Alternatives - [@vitejs/plugin-vue](https://github.com/vitejs/vite-plugin-vue/tree/main/packages/plugin-vue) - For Vite and Vue 3. - [@vitejs/plugin-vue2](https://github.com/vitejs/vite-plugin-vue2) - For Vite and Vue 2. - [unplugin-vue2](https://github.com/unplugin/unplugin-vue2) - For Vue 2.7+ and Vite, esbuild, Rollup, Webpack or more. - [vue-loader](https://github.com/vuejs/vue-loader) - For Webpack. - [esbuild-plugin-vue](https://github.com/egoist/esbuild-plugin-vue) - For esbuild and Vue 3. - [esbuild-vue](https://github.com/apeschar/esbuild-vue) - For esbuild and Vue 2. - ~~[vite-plugin-vue2](https://github.com/underfin/vite-plugin-vue2) - For Vite and Vue 2.~~ - ~~[rollup-plugin-vue](https://github.com/vuejs/rollup-plugin-vue)~~ - ⚠️ no longer maintained. ## Thanks - [Vite](https://github.com/vitejs/vite) - Next generation frontend tooling. It's fast! - [unplugin](https://github.com/unjs/unplugin) - Unified plugin system for Vite, Rollup, Webpack, and more - [vite-plugin-vue](https://github.com/vitejs/vite-plugin-vue) - This project is inherited from it. ## Sponsors <p align="center"> <a href="https://cdn.jsdelivr.net/gh/sxzz/sponsors/sponsors.svg"> <img src='https://cdn.jsdelivr.net/gh/sxzz/sponsors/sponsors.svg'/> </a> </p> ## License [MIT](./LICENSE) License © 2022-PRESENT [三咲智子](https://github.com/sxzz)