eslint-plugin-astro-explicit-wrapper

eslint-plugin-astro-explicit-wrapper

ESLint plugin for use in Astro, requires explicit wrapping adjacent JSX elements in && or ternary expressions with an HTML element or Fragment.

Why

Astro allows returning multiple elements, but when using ESLint Stylistic's indent rule, the inner elements are not properly indented. Wrapping them in a single element or Fragment ensures correct indentation and code style.

Installation

To use this plugin, you need to have install ESLint and eslint-plugin-astro in your Astro project.

npm install eslint eslint-plugin-astro-explicit-wrapper -D
# or
yarn add eslint eslint-plugin-astro-explicit-wrapper -D

Add the plugin to your ESLint configuration:

// eslint.config.js
import astroExplicitWrapper from 'eslint-plugin-astro-explicit-wrapper'

export default {
  ...astroExplicitWrapper.config,
}

Rules

Rule ID	Description
explicit-wrapper	Requires explicit wrapping adjacent JSX elements in && or ternary expressions with an HTML element or Fragment.

Sponsor

If this package has helped you, please consider becoming a sponsor to support my work. Your avatar will be displayed on my major projects.

Credits

• eslint-plugin-antfu

License

Under the MIT LICENSE