{"id":12380,"library":"vite-plugin-vue-setup-extend","title":"Vite Plugin for Vue Script Setup Extension","description":"This package, `vite-plugin-vue-setup-extend`, enhances the `<script setup>` syntactic sugar in Vue Single File Components (SFCs). Its primary function is to allow developers to define additional attributes directly on the `<script setup>` tag, such as `name` and `inheritAttrs`, which are typically unavailable in the standard `<script setup>` syntax. This capability is particularly useful for debugging with Vue DevTools, enabling recursive components, or explicitly setting component names for clearer component hierarchies. The current stable version is 0.4.0, but it was last published over four years ago (January 2022). Due to its lack of recent updates, it is considered abandoned and may not be compatible with newer versions of Vue or Vite, which have undergone significant changes since its last release. Users should proceed with caution and be prepared for potential compatibility issues with modern tooling.","status":"abandoned","version":"0.4.0","language":"javascript","source_language":"en","source_url":"https://github.com/vbenjs/vite-plugin-vue-setup-extend","tags":["javascript","vite","vue","stup","vite-plugin","typescript"],"install":[{"cmd":"npm install vite-plugin-vue-setup-extend","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-vue-setup-extend","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-vue-setup-extend","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency, required for the plugin to function within a Vite project.","package":"vite","optional":false}],"imports":[{"note":"Vite configuration files are typically ESM, so `require` is not supported. Use a named import.","wrong":"const vueSetupExtend = require('vite-plugin-vue-setup-extend')","symbol":"vueSetupExtend","correct":"import vueSetupExtend from 'vite-plugin-vue-setup-extend'"},{"note":"Standard Vite utility for defining configuration, often used alongside this plugin.","symbol":"defineConfig","correct":"import { defineConfig } from 'vite'"},{"note":"The official Vue plugin for Vite is a prerequisite and must be included before `vueSetupExtend`.","symbol":"vue","correct":"import vue from '@vitejs/plugin-vue'"}],"quickstart":{"code":"import { defineConfig } from 'vite';\nimport vue from '@vitejs/plugin-vue';\nimport vueSetupExtend from 'vite-plugin-vue-setup-extend';\n\nexport default defineConfig({\n  plugins: [\n    vue(),\n    vueSetupExtend()\n  ],\n  // Other Vite configurations...\n});","lang":"typescript","description":"This configuration demonstrates how to integrate `vite-plugin-vue-setup-extend` into your `vite.config.ts` file. It ensures that the plugin is activated alongside the official `@vitejs/plugin-vue` to extend `<script setup>` syntax capabilities."},"warnings":[{"fix":"Consider migrating to alternatives like `unplugin-vue-macros` or manually defining component options if you encounter issues. For new projects, avoid this plugin.","message":"This package has not been updated in over four years (last publish January 2022). Significant breaking changes have occurred in Vite and `@vitejs/plugin-vue` since then, making this plugin potentially incompatible with newer project setups.","severity":"breaking","affected_versions":">=0.4.0"},{"fix":"Always add `vueSetupExtend()` after `vue()` in the `plugins` array within `vite.config.ts`.","message":"Vite plugin ordering is crucial. Ensure `vite-plugin-vue-setup-extend` is placed *after* `@vitejs/plugin-vue` in your `plugins` array to ensure it correctly processes Vue SFCs.","severity":"gotcha","affected_versions":">=0.1.0"},{"fix":"Ensure your Vite config uses ES module syntax (`import/export`) or rename your config file to `.mjs`/`.mts` if necessary. If facing `ERR_REQUIRE_ESM`, refactor to `import` statements.","message":"Vite configurations are typically ESM-only. Using CommonJS `require()` syntax in `vite.config.js` or `vite.config.ts` will lead to errors, especially for ESM-only packages.","severity":"gotcha","affected_versions":">=0.1.0"}],"env_vars":null,"last_verified":"2026-04-19T00:00:00.000Z","next_check":"2026-07-18T00:00:00.000Z","problems":[{"fix":"Change `const vueSetupExtend = require('vite-plugin-vue-setup-extend')` to `import vueSetupExtend from 'vite-plugin-vue-setup-extend'`.","cause":"Attempting to import the plugin using CommonJS `require()` syntax in a Vite configuration file that expects ESM.","error":"Error [ERR_REQUIRE_ESM]: require() of ES Module ...vite-plugin-vue-setup-extend.js from ...vite.config.js not supported"},{"fix":"Verify the plugin's compatibility with your current Vite and Vue versions. If using an older plugin like `vite-plugin-vue-setup-extend`, consider if it's causing conflicts and disabling it or searching for a maintained alternative. Clear your Node modules and `node_modules/.vite` cache.","cause":"This generic Vue/Vite error can sometimes occur if a plugin, especially an outdated one, interferes with SFC parsing or hot module replacement (HMR).","error":"Internal server error: At least one <template> or <script> is required in a single file component."}],"ecosystem":"npm"}