# vue/no-restricted-block

disallow specific block

# 📖 Rule Details

This rule allows you to specify block names that you don't want to use in your application.

# 🔧 Options

This rule takes a list of strings, where each string is a block name or pattern to be restricted:

{
  "vue/no-restricted-block": ["error", "style", "foo", "bar"]
}
<!-- ✗ BAD --> <foo> Custom block </foo> <bar> Custom block </bar> <style> .foo {} </style>
Now loading...

Alternatively, the rule also accepts objects.

{
  "vue/no-restricted-block": ["error",
    {
      "element": "style",
      "message": "Do not use <style> block in this project."
    },
    {
      "element": "foo",
      "message": "Do not use <foo> block in this project."
    },
    {
      "element": "/forbidden/",
      "message": "Do not use blocks that include `forbidden` in their name."
    }
  ]
}

The following properties can be specified for the object.

  • element ... Specify the block element name or pattern.
  • message ... Specify an optional custom message.

# { "element": "foo" }, { "element": "/forbidden/" }

<!-- ✗ BAD --> <foo> ✗ BAD </foo> <forbidden-block></forbidden-block> <block-forbidden></block-forbidden>
Now loading...

# 🚀 Version

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

# 🔍 Implementation

Last Updated: 12/27/2020, 11:25:44 PM