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.

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

Not working with PUG template #617

Closed
enrico-hic opened this issue Dec 4, 2023 · 5 comments
Closed

Not working with PUG template #617

enrico-hic opened this issue Dec 4, 2023 · 5 comments

Comments

@enrico-hic
Copy link

enrico-hic commented Dec 4, 2023

What version of eslint are you using?
8.55.0

What version of prettier are you using?
3.1.0

What version of eslint-plugin-prettier are you using?
5.0.1

Please paste any applicable config files that you're using (e.g. .prettierrc or .eslintrc files)
.prettierrc

{
  "tabWidth": 2,
  "printWidth": 100,
  "singleQuote": true,
  "semi": false,
  "trailingComma": "all",
  "bracketSpacing": true,
  "bracketSameLine": false,
  "arrowParens": "always",
  "plugins": ["@prettier/plugin-pug"],
  "pugSortAttributes": "asc"
}

.eslintrc.json

{
  "env": {
    "browser": true,
    "commonjs": true,
    "es2021": true
  },
  "extends": [
    "eslint:recommended",
    "plugin:prettier/recommended"
  ],
  "plugins": [
    "pug"
  ],
  "parserOptions": {
    "ecmaVersion": "latest"
  }
}

What source code are you linting?
The plugin is working incorrectly in the files that use template pug (jade).
In the other files (like js) it is working correctly.

What did you expect to happen?
Report errors using the command eslint file.pug and highlight errors in the editor (VS Code).

What actually happened?
The errors are not highlighted in the editor but when I save the file is automatically formatted correctly using prettier.
The command eslint doesn't return any errors:

> eslint file.pug

npm timing command:run Completed in 202ms
npm verb exit 0
npm timing npm Completed in 223ms
npm info ok

But the command prettier report some errors:

> prettier file.pug --check

Checking formatting... : timing npm:load Completed in 18ms
[warn] file.pug
[warn] Code style issues found in the above file. Run Prettier to fix.
npm timing command:run Completed in 182ms
npm verb exit 1
npm timing npm Completed in 203ms
npm verb code 1

Steps to reproduce
You can find an example at this link: https://codesandbox.io/p/devbox/quizzical-joana-zlpzn8

Javascript working as expected:

  1. Run npm run prettier:js -> errors are found
  2. Run npm run lint:js -> errors from prettier are reported

Pug not working:

  1. Run npm run prettier:pug -> errors are found
  2. Run npm run lint:js -> no errors reported
@JounQin
Copy link
Member

JounQin commented Dec 4, 2023

We need runnable reproduction like codesandbox, GitHub Repository, etc. Not just codes.

@enrico-hic
Copy link
Author

We need runnable reproduction like codesandbox, GitHub Repository, etc. Not just codes.

I have added the sandbox to the issue description. As it's my first time with codesandbox, I hope it is configured correctly, if not please let me know.

@JounQin
Copy link
Member

JounQin commented Dec 4, 2023

I'll take a look tomorrow.

@JounQin
Copy link
Member

JounQin commented Dec 19, 2023

I don't how run commands on your CodeSandbox, but indeed, eslint-plugin-pug is not supported at all in this plugin.

@JounQin
Copy link
Member

JounQin commented Dec 19, 2023

An ESLint plugin for linting inline scripts in Pug files

eslint-plugin-pug is an ESLint plugin which only check inline scripts, not the whole file. So we don't have the chance to format the whole pug file at all.

So for pug files, you need to run prettier manually instead relying on this plugin.

However, there is still an area that we can improve that there is no need format the inline scripts inside pug.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants