# 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>
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>
# 🚀 Version
This rule was introduced in eslint-plugin-vue v7.4.0