vue/component-tags-order

强制组件顶层元素的顺序

• ⛔ 此规则已在 eslint-plugin-vue v10.0.0 中删除，并由 vue/block-order 规则替换。

📖 规则详情

此规则警告顶层标签的顺序，例如 <script>、<template> 和 <style>。

¥This rule warns about the order of the top-level tags, such as <script>, <template> & <style>.

🔧选项

¥🔧 Options

{
  "vue/component-tags-order": ["error", {
    "order": [ [ "script", "template" ], "style" ]
  }]
}

• order ((string|string[])[]) ...顶层元素名称的顺序。默认 [ [ "script", "template" ], "style" ]。也可能是 CSS 选择器，例如 script[setup] 和 i18n:not([locale=en])。

  ¥order ((string|string[])[]) ... The order of top-level element names. default [ [ "script", "template" ], "style" ]. May also be CSS selectors, such as script[setup] and i18n:not([locale=en]).

{ "order": [ [ "script", "template" ], "style" ] }（默认）

¥{ "order": [ [ "script", "template" ], "style" ] } (default)

Now loading...

Now loading...

Now loading...

{ "order": ["template", "script", "style"] }

Now loading...

Now loading...

{ "order": ["docs", "template", "script", "style"] }

Now loading...

Now loading...

{ 'order': ['template', 'script:not([setup])', 'script[setup]'] }

Now loading...

Now loading...

{ 'order': ['template', 'style:not([scoped])', 'style[scoped]'] }

Now loading...

Now loading...

{ 'order': ['template', 'i18n:not([locale=en])', 'i18n[locale=en]'] }

Now loading...

Now loading...

📚扩展阅读

¥📚 Further Reading

• 样式指南 - 单文件组件顶层元素顺序

  ¥Style guide - Single-file component top-level element order

🚀版本

¥🚀 Version

此规则在 eslint-plugin-vue v6.1.0 中引入

¥This rule was introduced in eslint-plugin-vue v6.1.0

🔍代码实现

¥🔍 Implementation

• 规则源

  ¥Rule source

• 测试源

  ¥Test source