{"record":{"id":"25a3e7b324339c7b","repo":"tailwindlabs/tailwindcss","slug":"the-rule-apply-list-must-not-have-a-body","errorCode":null,"errorMessage":"The rule `@apply ${list}` must not have a body.","messagePattern":"The rule `@apply (.+?)` must not have a body\\.","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/tailwindcss/src/apply.ts","lineNumber":209,"sourceCode":"\n        // If we find a dashed ident *here* it means that someone is trying\n        // to use mixins and our `@apply` behavior together.\n        //\n        // This is invalid and the rules must be written separately. Let the\n        // user know they need to move them into a separate rule.\n        let list = dashedIdents.join(' ')\n\n        throw new Error(\n          `You cannot use \\`@apply\\` with both mixins and utilities. Please move \\`@apply ${list}\\` into a separate rule.`,\n        )\n      }\n\n      let hasBody = child.nodes.length > 0\n\n      if (hasBody && normalIdents.length) {\n        let list = normalIdents.join(' ')\n\n        throw new Error(`The rule \\`@apply ${list}\\` must not have a body.`)\n      }\n\n      // Replace the `@apply` rule with the actual utility classes\n      {\n        // Parse the candidates to an AST that we can replace the `@apply` rule\n        // with.\n        let candidates = Object.keys(candidateOffsets)\n        let compiled = compileCandidates(candidates, designSystem, {\n          respectImportant: false,\n          onInvalidCandidate: (candidate) => {\n            // When using prefix, make sure prefix is used in candidate\n            if (designSystem.theme.prefix && !candidate.startsWith(designSystem.theme.prefix)) {\n              throw new Error(\n                `Cannot apply unprefixed utility class \\`${candidate}\\`. Did you mean \\`${designSystem.theme.prefix}:${candidate}\\`?`,\n              )\n            }\n\n            // When the utility is blocklisted, let the user know","sourceCodeStart":191,"sourceCodeEnd":227,"githubUrl":"https://github.com/tailwindlabs/tailwindcss/blob/16e94cbf7f965c5ad697e90e940b5e178efad67c/packages/tailwindcss/src/apply.ts#L191-L227","documentation":"Thrown when an `@apply` at-rule that references normal utility classes also contains a declaration body (i.e. `child.nodes.length > 0`). Tailwind v4 treats `@apply` as a pure substitution: it expands into the utility's CSS and cannot also hold its own declarations, so a body is rejected. The error lists the offending utility idents so the offending rule is identifiable.","triggerScenarios":"Writing CSS like `@apply flex { color: red; }` — an `@apply` whose params are normal utility idents (not `--dashed` mixins) AND whose node list is non-empty. Only fires when `hasBody && normalIdents.length` is truthy after the dashed-ident/mixin check has passed.","commonSituations":"Migrating from v3 where `@apply` accepted trailing declarations; muscle-memory of writing `@apply p-4 { @media (min-width: 768px) { ... } }`; copy-pasting nested at-rules inside an `@apply` block.","solutions":["Remove the body from the `@apply` rule and move those declarations into a sibling rule or wrap the `@apply` in an outer rule that also holds them.","If you need media-query scoping, put `@apply` inside a `@media` block instead of putting the media query inside `@apply`.","If you intended a CSS-mixin `@apply --foo;`, ensure it is the only content of the rule (dashed idents alone skip this check)."],"exampleFix":"// before\n.btn {\n  @apply px-4 py-2 {\n    color: red;\n  }\n}\n// after\n.btn {\n  @apply px-4 py-2;\n  color: red;\n}","handlingStrategy":"validation","validationCode":"// Before writing CSS, ensure no @apply with utility idents has a body.\nfunction assertApplyHasNoBody(css) {\n  const re = /@apply\\s+[^;{}]+\\s*\\{[^}]*\\}/g;\n  const hits = css.match(re) ?? [];\n  const bad = hits.filter(h => !/^[\\s\\S]*--/.test(h.split('@apply')[1]));\n  if (bad.length) throw new Error('Move declarations out of @apply body: ' + bad.join('\\n'));\n}\n// assertApplyHasNoBody(myCss);","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Lint `@apply` rules with a custom Stylelint rule forbidding a body when normal idents are present.","Treat `@apply` as a statement terminated by `;`, never as a block."],"tags":["tailwind","css","apply","syntax"],"backgroundTag":null,"analyzedSha":"16e94cbf7f965c5ad697e90e940b5e178efad67c","analyzedAt":"2026-08-12T06:02:42.469Z","schemaVersion":2},"datasetVersion":"2026-08-12T18:17:37.767Z"}