Skip to content
astro-doctor
Accessibilitywarn by defaultastro-doctor/require-island-fallback

require-island-fallback

Require fallback content for client-only and deferred server islands.

Why

client:only skips server rendering, and server:defer renders later on demand. Fallback content gives users immediate context instead of leaving an empty region while the island loads.

Examples

Incorrect

Island with no fallback

astro
---
import Chart from '../components/Chart.tsx'
---
<Chart client:only="react" />

Correct

Island with fallback content

astro
---
import Chart from '../components/Chart.tsx'
---
<Chart client:only="react">
  <div slot="fallback">Loading chart...</div>
</Chart>

Configuration

Override the default severity in your ESLint config:

javascripteslint.config.js
// eslint.config.js
import astroDoctorPlugin from '@santi020k/eslint-plugin-astro-doctor'

export default [
  astroDoctorPlugin.configs.recommended,
  {
    rules: {
      'astro-doctor/require-island-fallback': 'error',   // or 'warn' or 'off'
    },
  },
]

Or in your doctor.config.ts:

typescriptdoctor.config.ts
export default {
  rules: {
    'astro-doctor/require-island-fallback': 'error',
  },
}

All rules

Edit this page on GitHub ↗