Habilidades vue-options-api-best-practices

📦

vue-options-api-best-practices

Name: vue-options-api-best-practices
Author: github.com/vuejs-ai

v2.0.0 Revisão do conteúdo r1 Seguro ⚙️ Comandos externos🌐 Acesso à rede

Melhore Componentes Vue Options API

Projetos Vue Options API podem perder segurança de tipos e a vinculação correta de this. Esta skill fornece padrões diretos para componentes Vue mais seguros.

Suporta: Claude Codex Code(CC)

🥈 81 Prata

Instalar com meu Agente

Copie esta solicitação para o seu Agente. Ela inclui a página canônica do Skill e o manifesto.

Solicitação do agente

Review the Skillstore skill "vue-options-api-best-practices" from https://skillstore.io/skills/vuejs-ai-vue-options-api-best-practices.md and its manifest at https://skillstore.io/api/skills/vuejs-ai-vue-options-api-best-practices/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

Seu Agente ainda deve apresentar o plano e solicitar qualquer confirmação exigida pela política de segurança.

Recursos legíveis por agentes

Use estes links quando um agente de IA, crawler ou script precisar de contexto limpo em vez de ler a página completa.

Detalhe em Markdown GET /skills/vuejs-ai-vue-options-api-best-practices.md manifest assinado GET /api/skills/vuejs-ai-vue-options-api-best-practices/manifest lockfile assinado GET /api/skills/vuejs-ai-vue-options-api-best-practices/lockfile

Testar

Usando "vue-options-api-best-practices". Um hook mounted usa uma arrow function e não consegue ler os dados do componente.

Resultado esperado:

O hook deve usar sintaxe de função regular ou abreviação de método. Assim, o Vue pode vincular this à instância do componente.

Usando "vue-options-api-best-practices". Um componente aceita uma prop de objeto user e o TypeScript infere um tipo object amplo.

Resultado esperado:

Defina uma interface User e use Vue PropType para a prop. Adicione validação em tempo de execução se o formato do objeto precisar ser verificado.

Usando "vue-options-api-best-practices". Um método debounced se comporta incorretamente em instâncias repetidas do componente.

Resultado esperado:

Crie a função debounced por instância em um hook de ciclo de vida. Cancele timers durante unmount para evitar estado compartilhado e vazamentos.

Auditoria de segurança

Seguro

v4 • 07/07/2026 Abrir o relatório versionado

The static alerts are false positives caused by Markdown code fences, TypeScript template literals, Vue documentation links, and DOM event property names. No prompt injection, secret handling, command execution, or executable network behavior was found in the reviewed skill content.

Arquivos analisados

1,509

Linhas analisadas

Itens de revisão

Falsos positivos ignorados

Fatores de risco

⚙️ Comandos externos (8)

reference/no-arrow-functions-in-lifecycle-hooks.md:27-44 reference/no-arrow-functions-in-lifecycle-hooks.md:68-74 reference/no-arrow-functions-in-methods.md:28-38 reference/no-arrow-functions-in-methods.md:60-65 reference/ts-options-api-computed-return-types.md:79-84 reference/ts-options-api-computed-return-types.md:84-88 reference/ts-options-api-computed-return-types.md:106-116 reference/ts-strict-mode-options-api.md:120-124

🌐 Acesso à rede (1)

reference/no-arrow-functions-in-methods.md:57

A auditoria estática e semântica concluída mais recente não detectou achados de segurança confirmados. Isso não comprova que a skill não tenha efeitos colaterais.

Auditado por: codex Ver histórico de auditoria →

Compartilhar e citar este relatório

Compartilhe o relatório de avaliação versionado, o badge neutro, o cartão incorporável e as citações. A Skillstore apresenta evidências sem decidir se este Skill é seguro.

Abrir o relatório versionado

Copiar link do relatório

https://skillstore.io/skills/vuejs-ai-vue-options-api-best-practices/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Badge Markdown

[![Skillstore security assessment](https://skillstore.io/badges/skills/vuejs-ai-vue-options-api-best-practices/security.svg)](https://skillstore.io/skills/vuejs-ai-vue-options-api-best-practices?utm_source=security_passport_badge)

Badge HTML

<a href="https://skillstore.io/skills/vuejs-ai-vue-options-api-best-practices?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/vuejs-ai-vue-options-api-best-practices/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

Cartão incorporável

<iframe src="https://skillstore.io/embed/skills/vuejs-ai-vue-options-api-best-practices.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

Citações acadêmicas (APA · BibTeX · CFF)

Citação APA

github.com/vuejs-ai. (2026). vue-options-api-best-practices security audit report (audit version 4) [Author version 2.0.0]. Skillstore. https://skillstore.io/skills/vuejs-ai-vue-options-api-best-practices/audits/4

Citação BibTeX

@techreport{github-com-vuejs-ai-vuejs-ai-vue-options-api-best-practices-2026,
  author = {github.com/vuejs-ai},
  title = {vue-options-api-best-practices security audit report (audit version 4)},
  institution = {Skillstore},
  year = {2026},
  number = {4},
  url = {https://skillstore.io/skills/vuejs-ai-vue-options-api-best-practices/audits/4},
  note = {Author version 2.0.0}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "vue-options-api-best-practices security audit report (audit version 4)"
version: "2.0.0"
type: report
authors:
  - name: "github.com/vuejs-ai"
date-released: "2026-07-07"
url: "https://skillstore.io/skills/vuejs-ai-vue-options-api-best-practices/audits/4"
identifiers:
  - type: other
    value: "skillstore:vuejs-ai-vue-options-api-best-practices:audit:4"
    description: "Skillstore immutable audit report identifier"

Pontuação do Skillstore

Por que esta pontuação Confiança das evidências: Alto

Arquitetura

100

Manutenibilidade

Conteúdo

Comunidade

Conformidade com a especificação

O que você pode criar

Corrigir Erros de Vinculação de This

Use as referências de ciclo de vida e métodos para encontrar arrow functions que quebram o acesso à instância do componente.

Fortalecer Componentes TypeScript

Aplique defineComponent, PropType, modo estrito e tipos de retorno explícitos em componentes Options API existentes.

Revisar Código Vue Legado

Verifique componentes Options API mais antigos em busca de métodos com estado compartilhados, tipagem fraca de eventos e padrões de validadores desatualizados.

Teste estes prompts

Encontrar Problema de Vinculação de This

Revise este componente Vue Options API e explique por que this está undefined. Foque em métodos e hooks de ciclo de vida. [Cole o componente]

Adicionar Props TypeScript

Ajude-me a tipar estas props da Vue Options API com TypeScript. Inclua orientação sobre PropType para objetos, arrays e funções. [Cole as props]

Melhorar Manipuladores de Eventos

Revise estes manipuladores de eventos da Options API. Recomende tipos de eventos explícitos e tratamento mais seguro de target. [Cole os métodos e o template]

Auditar Práticas de Componentes

Audite este componente Vue Options API quanto à vinculação de this, suporte estrito a TypeScript, tipos de retorno computados e métodos com estado. [Cole o componente]

Boas práticas

Use abreviação de método ou funções regulares para métodos e hooks de ciclo de vida da Options API.
Envolva componentes TypeScript Options API com defineComponent e habilite verificação estrita.
Adicione tipos explícitos para props complexas, eventos, valores computados e propriedades injetadas.

Evitar

Usar arrow functions como hooks de ciclo de vida ou métodos de nível superior da Options API.
Depender de parâmetros de eventos sem tipo e inferência ampla de props de objeto.
Criar métodos debounced ou throttled compartilhados diretamente na opção methods.