# kdu-eslint-parser

> The ESLint custom parser for `.kdu` files.

Latest version **9.0.1** (published 2026-01-02) · MIT license · 0 weekly downloads

## Install

```sh
npm install kdu-eslint-parser
pnpm add kdu-eslint-parser
yarn add kdu-eslint-parser
bun add kdu-eslint-parser
```

## Health

**Score 50/100 (C)** — status: stable.

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support.

## Facts

| | |
|---|---|
| Version | 9.0.1 |
| Published | 2026-01-02 |
| First published | 2022-01-19 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Node | ^14.17.0 \|\| >=16.0.0 |
| Dependencies | 7 |
| Unpacked size | 1007.1 KB |
| Known vulnerabilities | 0 (+4 in 2 direct dependencies) |
| Install scripts | no |
| Author | NKDuy |
| Maintainers | nkduy |

## Links

- npm: https://www.npmjs.com/package/kdu-eslint-parser
- Repository: https://github.com/kdujs/kdu-eslint-parser
- Homepage: https://github.com/kdujs/kdu-eslint-parser#readme
- Issues: https://github.com/kdujs/kdu-eslint-parser/issues
- npm.io page: https://npm.io/package/kdu-eslint-parser

## Dependencies (7)

- [debug](https://npm.io/package/debug.md) 4.3.4
- [espree](https://npm.io/package/espree.md) 9.3.1
- [lodash](https://npm.io/package/lodash.md) 4.17.21
- [semver](https://npm.io/package/semver.md) 7.3.6
- [esquery](https://npm.io/package/esquery.md) 1.4.0
- [eslint-scope](https://npm.io/package/eslint-scope.md) 7.1.1
- [eslint-visitor-keys](https://npm.io/package/eslint-visitor-keys.md) 3.3.0

## Recent versions

- 9.0.1 (latest) — 2026-01-02
- 8.0.1 — 2022-12-23
- 8.0.0 — 2022-12-23
- 4.0.3 — 2022-12-16
- 2.0.4 — 2022-12-14
- 8.0.1-rc.0 — 2022-07-19
- 2.0.1-rc.0 — 2022-07-12
- 4.0.2 — 2022-01-20
- 3.2.1 — 2022-01-19
- 2.0.3 — 2022-01-19

## README

# kdu-eslint-parser

The ESLint custom parser for `.kdu` files.

## ⤴️ Motivation

This parser allows us to lint the `<template>` of `.kdu` files. We can make mistakes easily on `<template>` if we use complex directives and expressions in the template. This parser and the rules of [eslint-plugin-kdu](https://github.com/kdujs/eslint-plugin-kdu) would catch some of the mistakes.

## 💿 Installation

```bash
npm install --save-dev eslint kdu-eslint-parser
```

- Requires Node.js ^14.17.0, 16.0.0 or later.
- Requires ESLint 6.0.0 or later.

## 📖 Usage

1. Write `parser` option into your `.eslintrc.*` file.
2. Use glob patterns or `--ext .kdu` CLI option.

```json
{
    "extends": "eslint:recommended",
    "parser": "kdu-eslint-parser"
}
```

```console
$ eslint "src/**/*.{js,kdu}"
# or
$ eslint src --ext .kdu
```

## 🔧 Options

`parserOptions` has the same properties as what [espree](https://github.com/eslint/espree#usage), the default parser of ESLint, is supporting.
For example:

```json
{
    "parser": "kdu-eslint-parser",
    "parserOptions": {
        "sourceType": "module",
        "ecmaVersion": 2018,
        "ecmaFeatures": {
            "globalReturn": false,
            "impliedStrict": false,
            "jsx": false
        }
    }
}
```

### parserOptions.parser

You can use `parserOptions.parser` property to specify a custom parser to parse `<script>` tags.
Other properties than parser would be given to the specified parser.
For example:

```json
{
    "parser": "kdu-eslint-parser",
    "parserOptions": {
        "parser": "@babel/eslint-parser",
        "sourceType": "module"
    }
}
```

```json
{
    "parser": "kdu-eslint-parser",
    "parserOptions": {
        "parser": "@typescript-eslint/parser",
        "sourceType": "module"
    }
}
```

You can also specify an object and change the parser separately for `<script lang="...">`.

```jsonc
{
    "parser": "kdu-eslint-parser",
    "parserOptions": {
        "parser": {
             // Script parser for `<script>`
            "js": "espree",

             // Script parser for `<script lang="ts">`
            "ts": "@typescript-eslint/parser",

             // Script parser for kdu directives (e.g. `k-if=` or `:attribute=`)
             // and kdu interpolations (e.g. `{{variable}}`).
             // If not specified, the parser determined by `<script lang ="...">` is used.
            "<template>": "espree",
        }
    }
}
```

If the `parserOptions.parser` is `false`, the `kdu-eslint-parser` skips parsing `<script>` tags completely.
This is useful for people who use the language ESLint community doesn't provide custom parser implementation.

### parserOptions.kduFeatures

You can use `parserOptions.kduFeatures` property to specify how to parse related to Kdu features.
For example:

```json
{
    "parser": "kdu-eslint-parser",
    "parserOptions": {
        "kduFeatures": {
            "filter": true,
            "interpolationAsNonHTML": true,
            "styleCSSVariableInjection": true,
        }
    }
}
```

### parserOptions.kduFeatures.filter

You can use `parserOptions.kduFeatures.filter` property to specify whether to parse the Kdu2 filter. If you specify `false`, the parser does not parse `|` as a filter.
For example:

```json
{
    "parser": "kdu-eslint-parser",
    "parserOptions": {
        "kduFeatures": {
            "filter": false
        }
    }
}
```

If you specify `false`, it can be parsed in the same way as Kdu 3.
The following template parses as a bitwise operation.

```kdu
<template>
  <div>{{ a | b }}</div>
</template>
```

However, the following template that are valid in Kdu 2 cannot be parsed.

```kdu
<template>
  <div>{{ a | valid:filter }}</div>
</template>
```

### parserOptions.kduFeatures.interpolationAsNonHTML

You can use `parserOptions.kduFeatures.interpolationAsNonHTML` property to specify whether to parse the interpolation as HTML. If you specify `true`, the parser handles the interpolation as non-HTML (However, you can use HTML escaping in the interpolation). Default is `true`.
For example:

```json
{
    "parser": "kdu-eslint-parser",
    "parserOptions": {
        "kduFeatures": {
            "interpolationAsNonHTML": true
        }
    }
}
```

If you specify `true`, it can be parsed in the same way as Kdu 3.
The following template can be parsed well.

```kdu
<template>
  <div>{{a<b}}</div>
</template>
```

But, it cannot be parsed with Kdu 2.

### parserOptions.kduFeatures.styleCSSVariableInjection

If set to `true`, to parse expressions in `k-bind` CSS functions inside `<style>` tags. `k-bind()` is parsed into the `KExpressionContainer` AST node and held in the `KElement` of `<style>`. Default is `true`.

### parserOptions.templateTokenizer

You can use `parserOptions.templateTokenizer` property to specify custom tokenizers to parse `<template lang="...">` tags.

For example to enable parsing of pug templates:

```jsonc
{
    "parser": "kdu-eslint-parser",
    "parserOptions": {
        "templateTokenizer": {
             // template tokenizer for `<template lang="pug">`
            "pug": "kdu-eslint-parser-template-tokenizer-pug",
        }
    }
}
```

## 🎇 Usage for custom rules / plugins

- This parser provides `parserServices` to traverse `<template>`.
    - `defineTemplateBodyVisitor(templateVisitor, scriptVisitor, options)` ... returns ESLint visitor to traverse `<template>`.
    - `getTemplateBodyTokenStore()` ... returns ESLint `TokenStore` to get the tokens of `<template>`.
    - `getDocumentFragment()` ... returns the root `KDocumentFragment`.
    - `defineCustomBlocksVisitor(context, customParser, rule, scriptVisitor)` ... returns ESLint visitor that parses and traverses the contents of the custom block.
    - `defineDocumentVisitor(documentVisitor, options)` ... returns ESLint visitor to traverses the document.
- [ast.md](./docs/ast.md) is `<template>` AST specification.
- [mustache-interpolation-spacing.js](https://github.com/kdujs/eslint-plugin-kdu/blob/main/lib/rules/mustache-interpolation-spacing.js) is an example.

### `defineTemplateBodyVisitor(templateBodyVisitor, scriptVisitor, options)`

*Arguments*

- `templateBodyVisitor` ... Event handlers for `<template>`.
- `scriptVisitor` ... Event handlers for `<script>` or scripts. (optional)
- `options` ... Options. (optional)
  - `templateBodyTriggerSelector` ... Script AST node selector that triggers the templateBodyVisitor. Default is `"Program:exit"`. (optional)

```ts
import { AST } from "kdu-eslint-parser"

export function create(context) {
    return context.parserServices.defineTemplateBodyVisitor(
        // Event handlers for <template>.
        {
            KElement(node: AST.KElement): void {
                //...
            }
        },
        // Event handlers for <script> or scripts. (optional)
        {
            Program(node: AST.ESLintProgram): void {
                //...
            }
        },
        // Options. (optional)
        {
            templateBodyTriggerSelector: "Program:exit"
        }
    )
}
```

## ⚠️ Known Limitations

Some rules make warnings due to the outside of `<script>` tags.
Please disable those rules for `.kdu` files as necessary.

- [eol-last](http://eslint.org/docs/rules/eol-last)
- [linebreak-style](http://eslint.org/docs/rules/linebreak-style)
- [max-len](http://eslint.org/docs/rules/max-len)
- [max-lines](http://eslint.org/docs/rules/max-lines)
- [no-trailing-spaces](http://eslint.org/docs/rules/no-trailing-spaces)
- [unicode-bom](http://eslint.org/docs/rules/unicode-bom)
- Other rules which are using the source code text instead of AST might be confused as well.

### Development Tools

- `npm run build` compiles TypeScript source code to `index.js`, `index.js.map`, and `index.d.ts`.
- `npm run clean` removes the temporary files which are created by `npm run build`.
- `npm run lint` runs ESLint.
- `npm run setup` setups submodules to develop.

---
_Source: https://npm.io/package/kdu-eslint-parser · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._