https://github.com/rashfael/eslint-plugin-vue-pug

linting your pug templates in vue single file components
https://github.com/rashfael/eslint-plugin-vue-pug

eslint vue

Last synced: 7 days ago
JSON representation

linting your pug templates in vue single file components

• Host: GitHub
• URL: https://github.com/rashfael/eslint-plugin-vue-pug
• Owner: rashfael
• License: mit
• Created: 2022-03-27T12:02:38.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2024-04-02T12:08:44.000Z (9 months ago)
• Last Synced: 2024-12-09T04:36:19.671Z (18 days ago)
• Topics: eslint, vue
• Language: JavaScript
• Homepage:
• Size: 221 KB
• Stars: 45
• Watchers: 6
• Forks: 9
• Open Issues: 7
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# eslint-plugin-vue-pug

Extends [eslint-plugin-vue](https://eslint.vuejs.org/) to support pug templates.

## Installation

```sh

npm install --save-dev eslint@8 eslint-plugin-vue eslint-plugin-vue-pug

```

## Usage

Most [eslint-plugin-vue](https://eslint.vuejs.org/) rules work out of the box with just adding this plugin in your eslint config:

```js

module.exports = {

  extends: [

    'plugin:vue/vue3-recommended',

    'plugin:vue-pug/vue3-recommended'

  ]

}

```

## Limitations

- [pug-lexer](https://github.com/pugjs/pug/blob/master/packages/pug-lexer) seems to convert windows-style CRLF line endings to LF line endings, which may break token position and will give you errors. Make sure to [only use LF line endings](https://docs.github.com/en/get-started/getting-started-with-git/configuring-git-to-handle-line-endings).

### Supported Syntax

This plugin only lints pug syntax that directly corresponds to html syntax.

Pug syntax that is not supported includes mixins, js code, loops, if/else, case, include/extends.

The linter will just skip those features, which means that tags inside mixins will **not** be linted.

The rule [no-pug-control-flow](docs/rules/no-pug-control-flow.md) will help you to avoid unsupported pug syntax.

## Open Questions

### Comment Directive

Do we want own docs for that? Also, pug has no inline comments.

### #id and .class shorthands

Shorthands get dropped from attributes list to not affect attribute order. We need to add separate linter rules for those.

- `no-useless-template-attributes` checks for class on `template`, we need to also check shorthands.

- `no-restricted-class` needs special handling

### brace style

Existing rule fails at fixing and does not replace " quotes with `.

### parsing commas in dynamic attribute names

pug splits up attribute names like `:[[a,b,][1]]`

### spaces added by fix

`first-attribute-linebreak` adds a space between `tag(` and `attr=""` in certain scenarios.

### attribute separators

Things like `max-attributes-per-line` would need to include the `,` in the attribute range for some fixes to work correctly, but this would break `attribute-order`.

### HTML tokens

there are some rules relying on HTML* tokens, like `no-multi-spaces`.

### Splitting low level mustache tokens

### template attributes

having both lang and src attributes on template, what does that even do?

### HTML rules

Rules for HTML don't apply to pug, but do not seem to interfere with pug templates since they check `HTML*` tokens, which we don't emit. Should we still disable those rules or leave them on?