no-empty-component-block.md

pageClass	sidebarDepth	title	description
rule-details	0	vue/no-empty-component-block	disallow the `<template>` `<script>` `<style>` block to be empty

vue/no-empty-component-block

disallow the <template> <script> <style> block to be empty

📖 Rule Details

This rule disallows the <template> <script> <style> block to be empty.

This rule also checks block what has attribute src. See: https://vue-loader.vuejs.org/spec.html#src-imports

// ✓ GOOD
<template>
  <p>foo</p>
</template>

<script>
  console.log('foo')
</script>

<style>
  p {
    display: inline;
  }
</style>

<template src="./template.html"></template>
<template src="./template.html" />

<script src="./script.js"></script>
<script src="./script.js" />

<style src="./style.css"></style>
<style src="./style.css" />


// ✗ BAD
<template></template>
<template />
<template src="" />

<script></script>
<script />
<script src="" />

<style></style>
<style />
<style src="" />

🔧 Options

Nothing.

🔍 Implementation

• Rule source
• Test source