Question 1

How to set up eslint-plugin-html with ESLint 9's flat config?

Accepted Answer

Import the plugin and add it to your flat config with a files pattern for HTML/XML extensions. For example, use import html from 'eslint-plugin-html' and specify it in plugins for relevant files. Note that extensions need to be defined twice in files and settings, which can be redundant.

Question 2

Can I use eslint-plugin-html with Vue.js files?

Accepted Answer

No, eslint-plugin-html is incompatible with eslint-plugin-vue since v3. For Vue.js projects, use eslint-plugin-vue exclusively because it has its own parser for script tags in .vue files, and mixing them can cause conflicts.

Question 3

What's the best way to handle PHP script tags with eslint-plugin-html?

Accepted Answer

Use HTML comments like  to skip linting for specific script tags, or employ hacky workarounds such as embedding PHP code in JavaScript comments. Alternatively, consider eslint-plugin-php-markup for dedicated PHP file support.

Question 4

How does eslint-plugin-html manage multiple script tags in one HTML file?

Accepted Answer

By default, it shares global scope between non-module scripts to mimic browser behavior, but for ES modules, set sourceType to 'module' in ESLint config to treat each script separately. This affects rules like no-unused-vars and no-undef.

Question 5

Is eslint-plugin-html compatible with XML files containing CDATA sections?

Accepted Answer

Yes, it correctly parses XML files by dropping CDATA delimiters in XML mode, unlike HTML where they are treated as normal text. This ensures accurate script extraction and linting for XML-based projects.

Question 6

eslint-plugin-html vs other ESLint plugins for HTML linting?

Accepted Answer

eslint-plugin-html focuses solely on JavaScript within script tags, while plugins like @eslint-html handle HTML-specific rules. They can be used together, but eslint-plugin-html doesn't replace tools for markup validation, requiring additional setup.

HTML

What is HTML?

Overview

Use Cases

Best For

Related Projects

Found a gem we're missing?

Not Ideal For

Pros & Cons

Pros

Cons

Frequently Asked Questions