@nuxtjs/html-validator

@nuxtjs/html-validator is an open-source Nuxt module that validates the HTML rendered by Nuxt applications using html-validate, giving developers a zero-config way to catch markup errors and accessibility problems during development and in CI.

What is @nuxtjs/html-validator?

@nuxtjs/html-validator is a module for NuxtJS that runs the html-validate linter on the output HTML of your Nuxt application. It takes a Nuxt project as input and produces validation reports for the HTML that Nuxt generates. The module is maintained under the nuxt-modules GitHub organization and is released under the MIT License, making it free to use in any project.

Key Features

• Zero-configuration setup — install the module and HTML validation runs automatically with sensible defaults; no config file or rule tweaking is required to get started.
• Hydration error reduction — by catching invalid markup early, the module helps prevent common hydration mismatches between server-rendered and client-rendered HTML.
• Accessibility mistake detection — the validation includes rules that flag common a11y errors, such as missing alt attributes or incorrect ARIA usage.
• Built on html-validate — leverages the comprehensive html-validate linter, which provides a large rule set and is configurable for teams that want custom rules later.
• One-command installation — add the module to your Nuxt project with npx nuxi@latest module add html-validator.
• Open source and MIT licensed — the source is available on GitHub under nuxt-modules/html-validator, so you can inspect or extend it.

Who should use @nuxtjs/html-validator?

Nuxt developers who want to enforce HTML quality without extra configuration will find the module useful. Teams working on accessibility compliance can add it to the build pipeline to catch common issues automatically. Developers who see hydration warnings in their console can use this validation to locate the offending markup quickly.

What can you do with @nuxtjs/html-validator?

• Nuxt developers: run HTML validation in development and production builds to ensure the markup generated by components and plugins is clean.
• Accessibility-conscious teams: automatically detect common a11y mistakes on every render, reducing reliance on manual audits.
• CI pipelines: add the module to a Nuxt project so that pull requests are checked for invalid HTML before deployment.

How does it work?

Installation is a single command: npx nuxi@latest module add html-validator. The module hooks into Nuxt's build process and validates the rendered HTML using html-validate's default rules. Since it's zero-config, there's no extra setup — the validation runs behind the scenes and reports issues in the build output.

FAQ

Is @nuxtjs/html-validator free?

Yes. The module is published on npm under the MIT License, so it is free to use, modify, and redistribute in both open-source and commercial projects.

Do I need to configure anything?

No. The module is designed to be zero-configuration. After installing it, HTML validation runs with html-validate's default rules. If you later want custom rules, you can extend the configuration, but it is not required to get value out of the module.

What kind of errors does it catch?

It catches invalid HTML markup and common accessibility issues, like missing required attributes or improper element nesting. Because Nuxt renders HTML both on the server and in the client, catching these errors helps reduce hydration mismatches.