webpack-plugin-vue

Webpack preset for Vue 3 SFC，对标 @vitejs/plugin-vue，提供 vue-loader 与 SWC 集成。

推荐：用 create-all 新建 Vue 项目

npm create create-all@latest
# Webpack → Vue → TypeScript

生成工程已接入 webpack-common 与本 preset，开箱即用的 SFC + HMR 示例。

English — Scaffold: npm create create-all@latest → Webpack → Vue → TypeScript. See create-all.

安装

npm i webpack-common webpack-plugin-vue -D

本包为 preset 扩展，需与 webpack-common 的 defineConfig({ presets: [...] }) 配合使用。

项目还需安装 Vue 相关依赖：

npm i vue
npm i @vue/compiler-sfc vue-loader typescript -D

使用

// webpack.config.ts
import { defineConfig } from 'webpack-common'
import vue from 'webpack-plugin-vue'

export default defineConfig({
  presets: [vue()],
})

说明

• 自动配置 vue-loader（含 VueLoaderPlugin）
• 通过 SWC 编译 .ts / .js 文件
• 开发模式支持 Vue HMR，覆盖 <script setup lang="ts"> 场景
• 默认设置 enableTsInTemplate: false，避免虚拟模块路径导致的模板 HMR 失效

许可证

MIT