Vue option should not have typo

  • VUE_OPTION_TYPO
  • Error
  • Medium
  • vue

This rule applies when Vue options have typo.

Typos in the option names may prevent intended behaviors from occurring as follows:

  1. Vue lifecycle hooks having typo will not be called on the intended lifecycle
  2. Other Vue options having typo can cause Vue warnings, and the instance may not rendered as intended

Note: This rule is based on Vue 2.x API specifications.

Noncompliant Code Example

View with compliant examples side by side
import Vue from 'vue';

Vue.component('hello', {
  data() {
    return { msg: 'hi' };
  },
  beforeCreated() { // VUE_OPTION_TYPO alarm because 'beforeCreate' is a correct name of the lifecycle method.
    // do something
  },
  template: '<div>{{ msg }}</div>'
});

Compliant Code Example

View with noncompliant examples side by side
import Vue from 'vue';

Vue.component('hello', {
  data() {
    return { msg: 'hi' };
  },
  beforeCreate() {
    // do something
  },
  template: '<div>{{ msg }}</div>'
});

Version

This rule was introduced in DeepScan 1.14.0-beta.

See