Skip to content

vue/no-restricted-component-options

disallow specific component option

📖 Rule Details

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

🔧 Options

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

json
{  "vue/no-restricted-component-options": ["error", "init", "beforeCompile", "compiled", "activate", "ready", "/^(?:at|de)tached$/"] }
Now loading...

Also, you can use an array to specify the path of object properties.

e.g. [ "error", ["props", "/.*/", "twoWay"] ]

Now loading...

You can use "*" to match all properties, including computed keys.

e.g. [ "error", ["props", "*", "twoWay"] ]

Now loading...

Alternatively, the rule also accepts objects.

json
{  "vue/no-restricted-component-options": ["error",  {  "name": "init",  "message": "Use \"beforeCreate\" instead."  },  {  "name": "/^(?:at|de)tached$/",  "message": "\"attached\" and \"detached\" is deprecated."  },  {  "name": ["props", "/.*/", "twoWay"],  "message": "\"props.*.twoWay\" cannot be used."  }  ] }

The following properties can be specified for the object.

  • name ... Specify the component option name or pattern, or the path by its array.
  • message ... Specify an optional custom message.

🚀 Version

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

🔍 Implementation