Vue Mess Detector - Historial de revisiones

Joselv: /* Execución da análise */

2026-05-04T11:43:57Z

Execución da análise

Joselv: /* Configuración básica */

2026-05-04T11:43:08Z

Configuración básica

Joselv: Página creada con « Vue Mess Detector é unha ferramenta de análise estática específica para Vue.js e Nuxt.js que complementa o traballo de ESLint. En lugar de centrarse na sintaxe, detect…»

2026-05-04T11:39:53Z

Página creada con « Vue Mess Detector é unha ferramenta de análise estática específica para Vue.js e Nuxt.js que complementa o traballo de ESLint. En lugar de centrarse na sintaxe, detect…»

Página nueva

Vue Mess Detector é unha ferramenta de análise estática específica para Vue.js e Nuxt.js que complementa o traballo de ESLint. En lugar de centrarse na sintaxe, detecta "code smells" (malos olores no código), malas prácticas e problemas de mantemento nos ficheiros .vue .

= Instalación =

Para instalar a ferramenta como dependencia de desenvolvemento, executa no terminal:
npm install vue-mess-detector --save-dev

= Configuración básica =

A forma máis práctica de traballar con Vue Mess Detector é empregando un ficheiro de configuración na raíz do proxecto, xa que así non tes que escribir todas as opcións cada vez que executes o comando .

Crea un ficheiro chamado vue-mess-detector.json na raíz do teu proxecto Vue:

<syntaxhighlight lang="js">
{
"apply": "vue-essential,vue-strong",
"level": "error",
"group": "file",
"output": "table"
}
</syntaxhighlight>

No ficheiro vue-mess-detector.json podes definir entre outros:

{| class="wikitable"
! Opción !! Valores permitidos !! Por defecto !! Descrición
|-
| apply || vue-essential, vue-strong, vue-recommended, vue-caution, rrd || Todas || Regras que se aplicarán
|-
| ignore || Nomes de regras ou rulesets || - || Regras que se ignorarán
|-
| level || error, warning ou all || all || Mostrar só erros, só avisos ou todo
|-
| group || file ou rule || rule || Agrupar resultados por ficheiro ou por regra
|-
| output || text, table ou json || text || Formato de saída
|-
| exclude || Camiños (separados por coma) || - || Directorios ou ficheiros a excluír
|}

Existen cinco conxuntos de regras con diferentes niveis de rigor :

{| class="wikitable"
! Ruleset !! Descrición
|-
| vue-essential || Regras que axudan a previr erros. Deben cumprirse sempre.
|-
| vue-strong || Melloran a lexibilidade e a experiencia de desenvolvemento. Altamente recomendadas.
|-
| vue-recommended || Garantizan consistencia cando hai varias opcións igualmente válidas.
|-
| vue-caution || Sinalan características de Vue que poden levar a un código difícil de manter.
|-
| rrd || Regras opinadas e moi específicas, non recomendadas para uso xeral.
|}

= Execución da análise =

Unha vez configurado o ficheiro, podes analizar todo o proxecto simplemente con:
npx vue-mess-detector analyze

Se queres analizar só un directorio concreto:
npx vue-mess-detector analyze ./src/components

Os resultados amosaranse con cores no terminal: as mensaxes vermellas indican erros que hai que corrixir, e as amarelas son avisos sobre boas prácticas .

= Integración con ESLint =

Vue Mess Detector non substitúe a ESLint, senón que o complementa.

Mentres ESLint revisa a sintaxe e o formato do código, Vue Mess Detector detecta problemas arquitectónicos e malas prácticas específicas do ecosistema Vue (como compoñentes demasiado grandes, ficheiros moi extensos ou patróns pouco óptimos).

Aconséllase usar ambas ferramentas en paralelo para obter unha análise completa da calidade do código.

← Revisión anterior		Revisión del 11:43 4 may 2026
Línea 60:		Línea 60:

	= Execución da análise =		= Execución da análise =
		+
		+	[[File:Vue-mess-detector-output.png\|right\|thumb\|Saída cun erro e 28 warnings]]

	Unha vez configurado o ficheiro, podes analizar todo o proxecto simplemente con:		Unha vez configurado o ficheiro, podes analizar todo o proxecto simplemente con:

@@ Línea 8: / Línea 8: @@
 = Configuración básica =
 A forma máis práctica de traballar con Vue Mess Detector é empregando un ficheiro de configuración na raíz do proxecto, xa que así non tes que escribir todas as opcións cada vez que executes o comando .
@@ Línea 23: / Línea 25: @@
 No ficheiro vue-mess-detector.json podes definir entre outros:
 {| class="wikitable"
@@ Línea 43: / Línea 44: @@
 Existen cinco conxuntos de regras con diferentes niveis de rigor :
 {| class="wikitable"
@@ Línea 58: / Línea 58: @@
 | rrd || Regras opinadas e moi específicas, non recomendadas para uso xeral.
 |}
 = Execución da análise =