Skip to content


disallow specific classes in Vue components

📖 Rule Details

This rule lets you specify a list of classes that you don't want to allow in your templates.

🔧 Options

The simplest way to specify a list of forbidden classes is to pass it directly in the rule configuration.

  "vue/no-restricted-class": ["error", "forbidden", "forbidden-two", "forbidden-three", "/^for(bidden|gotten)/"]
Now loading...


This rule will only detect classes that are used as strings in your templates. Passing classes via variables, like below, will not be detected by this rule.

  <div :class="classes" />

export default {
  data() {
    return {
      classes: 'forbidden'

🚀 Version

This rule was introduced in eslint-plugin-vue v7.19.0

🔍 Implementation