@cairocampos98/dm-counter-wc

Web Component criado com Vue 3 + TypeScript + Vite

Instalação

npm install @cairocampos98/dm-counter-wc

Uso

Com registro automático

import { register } from '@cairocampos98/dm-counter-wc'

// Registra o web component automaticamente
register()

Depois use no HTML:

<dm-counter-wc msg="Olá Mundo!"></dm-counter-wc>

Importação manual

import { DmCounterWc } from '@cairocampos98/dm-counter-wc'

// Registre manualmente com um nome customizado
customElements.define('meu-contador', DmCounterWc)

Em aplicações Vue

<script setup>
import { DmCounterWc } from '@cairocampos98/dm-counter-wc'

// Registrar globalmente
app.component('DmCounterWc', DmCounterWc)
</script>

<template>
  <DmCounterWc msg="Contador Vue" @increment-count="handleIncrement" />
</template>

Props

• msg (string): Mensagem a ser exibida no componente

Eventos

• increment-count: Emitido quando o contador é incrementado, retorna o valor atual

Desenvolvimento

# Instalar dependências
npm install

# Modo desenvolvimento
npm run dev

# Build para produção
npm run build

# Preview da build
npm run preview

Tecnologias

• Vue 3
• TypeScript
• Vite
• Web Components API