Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

eslint-plugin-html and prettier have autofix issues with indent changes #131

Open
Standard8 opened this issue Jul 28, 2020 · 0 comments
Open

eslint-plugin-html and prettier have autofix issues with indent changes #131

Standard8 opened this issue Jul 28, 2020 · 0 comments
Labels
bug

Comments

@Standard8
Copy link

Description

We are trying to use prettier as part of ESLint, alongside eslint-plugin-html. This seems to generally work, however, it is getting confused with indentation fixes.

Setup configuration

  • ESLint version: 7.5.0
  • eslint-plugin-html version: 6.0.0 (also tried 6.0.2)
  • prettier: 1.19.1 and 2.0.5
  • eslint-plugin-prettier: 3.1.2 and 3.1.4
  • eslint-config-prettier: 6.11.0
  • NodeJS version: 10.21.0
  • Operating System name and version: MacOS 10.14.6
  • ESLint configuration (.eslintrc):
modules.exports = {
  extends: ["plugin:prettier/recommended"],
  plugins: ["html"]
}
  • Prettier configuration:
{
  "endOfLine": "lf",
  "printWidth": 80,
  "tabWidth": 2,
  "trailingComma": "es5"
}

Aditional context

Input test.html file:

<!DOCTYPE html>
<html>
<head>
  <title>Test</title>
</head>
<body>
<script>
  function test() {
    ok(
      true,
  'Some very very very very very very very very very very very very long line'
  );
  }
</script>
</body>
</html>

Run eslint --fix --ext .html test.html

Result (no changes, just errors raised):

/Users/mark/dev/gecko/test.html
  11:3  error  Insert `····`         prettier/prettier (eslint)
  12:3  error  Insert `··`           prettier/prettier (eslint)

I've seen various combinations of this, using this as the test function:

<script>
  function test() {
    ok(true, "Some very very very very very very very very very very very very long line");
  }
</script>

Results in it split across lines, but the last line indented incorrectly:

<script>
  function test() {
    ok(
      true,
      "Some very very very very very very very very very very very very long line"
  );
  }
</script>

I guess that the prettier is somehow defeating eslint-plugin-html's whitespace handling.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@BenoitZugmeyer @Standard8