vite-plugin-vue-setup-inherit-attrs

Extend vue script setup syntactic sugar to support inherit-attrs
3,464
Install
npm install vite-plugin-vue-setup-inherit-attrs
Latest Version:1.0.10
License:MIT
Last Updated:Jun 9, 2024
Links: npm
Maintainer: khr2003

vite-plugin-vue-setup-inherit-attrs

Add support for inheritAttrs in vue-setup using vite





[!WARNING] You don't need this plugin if you are using Vue 3.3+

Use defineOptions instead.

Install

npm install vite-plugin-vue-setup-inherit-attrs -D


Usage

In vite.config.ts import the plugin and add plugins array:

import { defineConfig, Plugin } from 'vite'
import vue from '@vitejs/plugin-vue'
import inheritAttrs from 'vite-plugin-vue-setup-inherit-attrs';

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

In vue template add inherit-attrs="false":

<template>
  <div class="root-element">
	  <div class="nested-element" v-bind="$attrs">
		  $attrs will be added to this element instead of the root element
	  </div>
  </div>
</template>

<script lang="ts" setup inherit-attrs="false">
  // code here
</script>


Config

No config needed :)



Change Log

1.0.4

  • Moved to full ESM


Other projects

Vue Icons

60,000+ SVG icons from popular icon sets that you can add seamlessly to your vue projects

Vue Popper

A tooltip component for Vue 3 based on popper.js

KalimahApps Eslint Config

Comprehensive eslint rules for vue projects with typescript



License

MIT License

Related Packages

@vinxi/vite-plugin-inspect

Inspect the intermediate state of Vite plugins

8,820 1,699
vite-plugin-vue-md

Simple and fast vue3 markdown vite plugin

365 1
@vitejs/plugin-vue

The official plugin for Vue SFC support in Vite.

333,357,380 686
vite-plugin-checker

Vite plugin that runs TypeScript type checker on a separate process.

133,975,562 1,242
@vitejs/plugin-vue-jsx

Provides Vue 3 JSX & TSX support with HMR.

93,663,827 686

Version History

Version Released License
1.0.10 MIT
1.0.9 MIT
1.0.8 MIT
1.0.7 MIT
1.0.6 MIT