Skip to content

@intlify/vue-i18n/no-v-html

disallow use of localization methods on v-html to prevent XSS attack

  • ⭐ The "extends": "plugin:@intlify/vue-i18n/recommended" or *.configs["flat/recommended"] property in a configuration file enables this rule.

This rule reports all uses of localization methods on v-html directive in order to reduce the risk of injecting potentially unsafe / unescaped html into the browser leading to Cross-Site Scripting (XSS) attacks.

📖 Rule Details

You can be detected with this rule the following:

  • $t
  • t
  • $tc
  • tc

👎 Examples of incorrect code for this rule:

locale messages:

json
{
  "term": "<p>I accept xxx <a href=\"/term\">Terms of Service Agreement</a></p>"
}

localization codes:

👍 Examples of correct code for this rule:

locale messages:

json
{
  "tos": "Term of Service",
  "term": "I accept xxx {0}."
}

localization codes:

🔇 When Not To Use It

If you are certain the content passed to v-html is trusted HTML you can disable this rule.

📚 Further reading

🚀 Version

This rule was introduced in @intlify/eslint-plugin-vue-i18n v0.1.0

🔍 Implementation