eslint-plugin-vue

外观

vue/component-options-name-casing ​

强制执行 components 选项中组件名称的大小写

  • 🔧 命令行 上的 --fix 选项可以自动修复此规则报告的一些问题。
  • 💡 此规则报告的一些问题可以通过编辑器 建议 手动修复。

📖 规则详细信息 ​

此规则旨在强制执行 components 选项中组件名称的大小写。

🔧 选项 ​

json
{
  "vue/component-options-name-casing": ["error", "PascalCase" | "kebab-case" | "camelCase"]
}

此规则有一个选项，可以是以下值之一

  • "PascalCase" (默认) ... 强制组件名称为帕斯卡大小写。
  • "kebab-case" ... 强制组件名称为短横线分隔大小写。
  • "camelCase" ... 强制组件名称为驼峰大小写。

请注意，如果您在 components 选项中使用短横线分隔大小写，则只能在模板中使用短横线分隔大小写；如果您在 components 选项中使用驼峰大小写，则不能在模板中使用帕斯卡大小写。

为了演示，代码示例无效

vue
<template>
  <div>
    <!-- All are invalid. DO NOT use like these. -->
    <KebabCase />
    <kebabCase />
    <CamelCase />
  </div>
</template>

<script>
export default {
  components: {
    camelCase: MyComponent,
    'kebab-case': MyComponent
  }
}
</script>

"PascalCase" (默认) ​

正在加载...
正在加载...

"kebab-case" ​

正在加载...
正在加载...

"camelCase" ​

正在加载...
正在加载...

🚀 版本 ​

此规则是在 eslint-plugin-vue v8.2.0 中引入的

🔍 实现 ​