解决:Component name “index“ should always be multi-word

解决:Component name “index“ should always be multi-word_第1张图片

一、背景

vue报错:Component name "Index" should always be multi-word

二、原因

要求组件名称以驼峰格式命名,自定义组件名称应该由多单纯组成,防止和html标签冲突,所以Index.vue 会报错

三、解决方案

1、按照规则,将组件名称改为驼峰格式,如:firstIndex.vue

2、若有.eslintrc.js文件,并在规则中(rules)关闭命名规则:

'vue/multi-word-component-names': 'off'

如下所示:

rules: {
    'space-before-function-paren': ['error', 'never'],
     //在rules中添加自定义规则
     //关闭组件命名规则
    'vue/multi-word-component-names': 'off'
  }

若没有.eslintrc.js文件,也可以直接在package.json文件中添加:

"rules": {
     //在rules中添加自定义规则
     //关闭组件命名规则
      "vue/multi-word-component-names": "off"
    }

解决:Component name “index“ should always be multi-word_第2张图片

最后:输入 yarn serve重新启动,就不会出错了

你可能感兴趣的:(javascript,前端,vue.js)