Skip to content

html-end-tags and html-self-closing conflict #217

Closed
@jpickwell

Description

@jpickwell

Tell us about your environment

  • ESLint Version: 4.9.0
  • eslint-plugin-vue Version: 3.13.1
  • Node Version: 8.2.1

Please show your full configuration:

const OFF = 'off'
const WARN = 'warn'
const ERROR = 'error'

module.exports = {
  extends: [
    'eslint:recommended',
    'plugin:lodash/recommended',
    'plugin:you-dont-need-lodash-underscore/compatible',
    'plugin:vue/recommended',
    'standard'
  ],
  plugins: [
    'babel',
    // 'html',
    'lodash'
  ],
  parserOptions: { parser: 'babel-eslint' },
  env: {
    commonjs: true,
    jquery: true
  },
  rules: {
    'vue/html-end-tags': ERROR,
    'vue/html-self-closing': ERROR
  }
}

What did you do? Please include the actual source code causing the issue.

<template>
  <fa-icon class="fa-spinner fa-lg fa-pulse" title="Uploading..." />
</template>

What did you expect to happen?
No error.

What actually happened? Please include the actual, raw output from ESLint.
'' should have end tag. (vue/html-end-tags)

Setting the html.component option to 'never' on the vue/html-self-closing rule and then using a closing tag instead of self-closing fixes the issue, but the default options cause a conflict.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions