How to resolve "multi-word vue/multi-word-component-names" issue in VueJs 3 default option.

Problem:-

While running the VueJs application failed with "Multi-word vue/multi-word-component-names" error.

/home/user/tutorials/animations-vuejs/src/components/HelloWorld.vue
  35:9  error  Component name "hello" should always be multi-word  vue/multi-word-component-names

✖ 1 problem (1 error, 0 warnings)

Solution:-

This problem is due to the 'eslint' setting issues. By default, the linting rule is enabled in Vuejs (Default ([Vue 3] babel, eslint)).

You can resolve this problem in two ways,

Method - 1:

Rename the component name. Here in this case the component name provided is 'hello', you can change this as a multi-word like 'HelloWorld'.

export default {
  name: 'HelloWorld',
  props: {
    msg: String
  }
}

Method - 2:

Disable the linting rule. By disabling the 'eslint' execute the below command.

$ npm remove @vue/cli-plugin-eslint