react-doctor/nextjs-no-css-link

Import CSS directly: `import './styles.css'` or use CSS Modules: `import styles from './Button.module.css'`

• Category: Next.js
• Severity: warn
• Source: oxlint-plugin-react-doctor
• Framework: nextjs
• Enabled when: framework=nextjs and capabilities=nextjs

Validation prompt

Use this to decide whether a fired diagnostic is real or a false positive.

Flags <link rel="stylesheet" href="..."> JSX elements with a string-literal href and rel="stylesheet". Google Fonts URLs are explicitly excluded (covered by nextjs-no-font-link). Preload, preconnect, and dns-prefetch <link> tags are not flagged.

Fix prompt

Use this once validation confirms the diagnostic is real.

Import the CSS directly so Next.js bundles, minifies, and code-splits it: import './styles.css' for globals (root layout only) or import styles from './Button.module.css' for scoped CSS Modules. Tailwind/PostCSS pipelines also work via the entry CSS import. https://nextjs.org/docs/app/getting-started/css

Related rules

More Next.js rules from the rules reference:

• react-doctor/nextjs-no-default-export-in-route-handler: Remove the default export from this route.ts and export the handler as a named HTTP method instead: export async function GET(request: Request) { ... }
• react-doctor/nextjs-no-edge-og-runtime: Remove `export const runtime = "edge"` from OG image route files so they use the default Node.js runtime
• react-doctor/nextjs-no-font-link: `import { Inter } from "next/font/google"` — self-hosted, zero layout shift, no render-blocking requests
• react-doctor/nextjs-no-google-analytics-script: Replace manual GA script with the optimized component: import { GoogleAnalytics } from '@next/third-parties/google'
• react-doctor/nextjs-no-head-import: Use the Metadata API instead: `export const metadata = { title: '...' }` or `export async function generateMetadata()`