Registry / testing / astro-eslint-parser

astro-eslint-parser

library1.4.0jsnpmunverified

astro-eslint-parser is a specialized parser that enables ESLint to understand and lint `.astro` component files. It allows developers to integrate Astro projects with their existing ESLint configurations, providing linting for scripts embedded within Astro components, including client-side scripts and component scripts. The current stable version is 1.4.0, with regular patch and minor releases to improve compatibility with newer Astro compiler versions, ESLint, and TypeScript-ESLint. Its primary differentiator is its dedicated support for the unique syntax of Astro files, making it a crucial component for maintaining code quality in Astro projects, often used in conjunction with `eslint-plugin-astro` for a complete linting solution.

testing

npm install astro-eslint-parser

github ↗package ↗

INSTALL

IMPORT

SIG · ASTRO-ESLINT-PARSE

astro-eslint-parser

testingjavascriptv1.4.0

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

parser configuration

✓ { "parser": "astro-eslint-parser" }

✗ import { Parser } from 'astro-eslint-parser'

This package is not imported directly into JavaScript/TypeScript files by end-users. It's configured in ESLint's `.eslintrc` file.

TypeScript sub-parser

✓ { "parserOptions": { "parser": "@typescript-eslint/parser" } }

✗ { "parserOptions": { "typescript": true } }

To lint TypeScript code within Astro components, explicitly specify `@typescript-eslint/parser` in `parserOptions.parser`.

ESLint plugin integration

✓ { "extends": ["plugin:astro/recommended"] }

✗ import { AstroPlugin } from 'eslint-plugin-astro'

For most use cases, it's recommended to use `eslint-plugin-astro` which internally uses `astro-eslint-parser` and provides sensible defaults and rules.

This quickstart demonstrates how to install `astro-eslint-parser` and configure ESLint, including `eslint-plugin-astro` and TypeScript support, to lint Astro files.

npm install --save-dev eslint astro-eslint-parser eslint-plugin-astro // .eslintrc.cjs module.exports = { root: true, env: { browser: true, es2020: true, node: true }, extends: [ 'eslint:recommended', 'plugin:astro/recommended', 'plugin:@typescript-eslint/recommended' // If using TypeScript ], parser: 'astro-eslint-parser', parserOptions: { ecmaVersion: 'latest', sourceType: 'module', project: './tsconfig.json', // Only if using @typescript-eslint/parser with project-level rules extraFileExtensions: ['.astro'], parser: '@typescript-eslint/parser' // Enable TypeScript parsing within Astro files }, overrides: [ { files: ['*.astro'], parser: 'astro-eslint-parser', parserOptions: { parser: '@typescript-eslint/parser' // Re-specify for overrides to ensure TS parsing } } ] }; // Add a script to your package.json: // "lint": "eslint \"**/*.{js,ts,astro}\" --cache --fix"

Debug

Known issues

gotchaThis parser is considered to be in 'experimental stages' of development. While functional, breaking changes or unexpected behavior might occur between minor versions.

fix

Stay updated with releases and test configurations thoroughly after upgrades. Report issues to the GitHub repository.

affects: >=1.0.0

breakingCompatibility with `@astrojs/compiler` is crucial. Updates to the Astro compiler might require `astro-eslint-parser` updates to function correctly, potentially breaking linting if not aligned.

fix

Ensure `astro-eslint-parser` is updated to a version explicitly supporting your `@astrojs/compiler` version, as indicated in release notes (e.g., v1.4.0 added support for `@astrojs/compiler` v3).

affects: >=1.0.0

gotchaUsing the parser alone only lints the script of `.astro` files. It does not lint scripts inside `<script>` tags by itself.

fix

It is highly recommended to use `eslint-plugin-astro` alongside this parser, as it provides rules and configurations to correctly lint all script contexts within Astro components, including `<script>` tags.

affects: >=1.0.0

breakingUpdates to `@typescript-eslint/parser` or ESLint itself (e.g., ESLint v10) can sometimes require corresponding updates or configuration adjustments in `astro-eslint-parser`.

fix

Keep `astro-eslint-parser` updated to its latest version to ensure compatibility. For example, v1.3.0 improved compatibility with ESLint v10, and v1.0.3 fixed support for `typescript-eslint@8`.

affects: >=1.0.0

Errors

Common errors & fixes

Parsing error: 'import' and 'export' may only appear at the top level (If using CommonJS config with `sourceType: module`)

ESLint is configured for CommonJS (`sourceType: script`) but encountered ESM syntax in an Astro file.

fix

Ensure `parserOptions.sourceType` is set to `module` in your `.eslintrc` file, especially within the `overrides` section for `*.astro` files.

Error: Cannot find module '@typescript-eslint/parser'

You've configured `parserOptions.parser: '@typescript-eslint/parser'` but the package is not installed.

fix

Install the TypeScript ESLint parser: `npm install --save-dev @typescript-eslint/parser`.

Parsing error: Unexpected token <

ESLint is attempting to parse Astro's HTML-like syntax or components with a standard JavaScript parser.

fix

Ensure `astro-eslint-parser` is correctly specified as the `parser` for `*.astro` files in your ESLint configuration's `overrides` section.

Parsing error: Element is missing closing tag. (When linting Astro components)

This parser sometimes has trouble with malformed HTML or specific Astro component syntax, especially when it's experimental.

fix

Update `astro-eslint-parser` to the latest version. Check the Astro component for valid HTML/JSX structure, and report specific cases to the maintainers if the issue persists with valid code.

Upgrade

Version history

1.4.0latest on npm

Audit

Dependencies

eslintrequiredThis package is an ESLint parser and requires ESLint to function.

@typescript-eslint/parseroptionalOften used as a sub-parser for TypeScript code within Astro components, configured via `parserOptions.parser`.

@astrojs/compilerrequiredInternally used for parsing Astro components; compatibility with specific versions is crucial.

Agent activity

19 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/ota-meshi/astro-eslint-parser ↗

packagehttps://www.npmjs.com/package/astro-eslint-parser ↗