{"record":{"id":"ed4fd6b3243376bf","repo":"sveltejs/svelte","slug":"migrating-this-component-would-require-adding-a","errorCode":null,"errorMessage":"migrating this component would require adding a `$${rune}` rune but there's already a variable named ${rune}.\n     Rename the variable and try again or migrate by hand.","messagePattern":"migrating this component would require adding a `\\$(.+?)` rune but there's already a variable named (.+?)\\.\n     Rename the variable and try again or migrate by hand\\.","errorType":"exception","errorClass":"MigrationError","httpStatus":null,"severity":"warning","filePath":"packages/svelte/src/compiler/migrate/index.js","lineNumber":280,"sourceCode":"\t\t\tstr.appendRight(insertion_point, `\\n${indent}${legacy_import}`);\n\t\t}\n\n\t\tif (state.script_insertions.size > 0) {\n\t\t\tstr.appendRight(\n\t\t\t\tinsertion_point,\n\t\t\t\t`\\n${indent}${[...state.script_insertions].join(`\\n${indent}`)}`\n\t\t\t);\n\t\t}\n\n\t\tinsertion_point = state.props_insertion_point;\n\n\t\t/**\n\t\t * @param {\"derived\"|\"props\"|\"bindable\"} rune\n\t\t */\n\t\tfunction check_rune_binding(rune) {\n\t\t\tconst has_rune_binding = !!state.scope.get(rune);\n\t\t\tif (has_rune_binding) {\n\t\t\t\tthrow new MigrationError(\n\t\t\t\t\t`migrating this component would require adding a \\`$${rune}\\` rune but there's already a variable named ${rune}.\\n     Rename the variable and try again or migrate by hand.`\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\n\t\tif (state.props.length > 0 || analysis.uses_rest_props || analysis.uses_props) {\n\t\t\tconst has_many_props = state.props.length > 3;\n\t\t\tconst newline_separator = `\\n${indent}${indent}`;\n\t\t\tconst props_separator = has_many_props ? newline_separator : ' ';\n\t\t\tlet props = '';\n\t\t\tif (analysis.uses_props) {\n\t\t\t\tprops = `...${state.names.props}`;\n\t\t\t} else {\n\t\t\t\tprops = state.props\n\t\t\t\t\t.filter((prop) => !prop.type_only)\n\t\t\t\t\t.map((prop) => {\n\t\t\t\t\t\tlet prop_str =\n\t\t\t\t\t\t\tprop.local === prop.exported ? prop.local : `${prop.exported}: ${prop.local}`;","sourceCodeStart":262,"sourceCodeEnd":298,"githubUrl":"https://github.com/sveltejs/svelte/blob/20b341f10048cf1016a2028ac7eee5595cfef6a5/packages/svelte/src/compiler/migrate/index.js#L262-L298","documentation":"Thrown (as a `MigrationError`) by Svelte's Svelte 4 → 5 codemod when a component needs one of the runes `$derived`, `$props`, or `$bindable` injected, but the component's own scope already declares a user variable with that bare name (e.g. `let derived = ...`). Injecting the rune would shadow or collide with the variable, so the automigrator refuses rather than produce broken code. The migrate entry function catches it and emits the original source back with a `<!-- @migration-task -->` comment instead of crashing.","triggerScenarios":"Running `npx sv migrate svelte-5` (or the programmatic `migrate()` export) on a component that (a) needs `$props`/`$derived`/`$bindable` generated and (b) contains a top-level `let derived`, `let props`, or `let bindable` declaration. The `check_rune_binding` helper looks up the rune name in `state.scope` and throws when the binding exists.","commonSituations":"Pre-existing variables named `props`, `derived`, or `bindable` in Svelte 4 components — `props` in particular is a common local alias for `$props`-style patterns or for forwarded prop bags. Migration succeeds for other components in the batch but stalls on these.","solutions":["Rename the colliding variable in the source component (e.g. `let props` → `let forwardedProps`) and re-run the migrator.","If you do not need the automigrator for that file, migrate it by hand and skip the codemod for it.","Grep the component for `\\b(props|derived|bindable)\\b` declarations before running migrate to pre-empt the collision."],"exampleFix":"// before\n<script>\n  export let derived;\n  let derived = computed();\n</script>\n\n// after (rename, then migrate)\n<script>\n  let { derivedValue = computed() } = $props();\n</script>","handlingStrategy":"validation","validationCode":"// Before running migrate(), scan the component for rune-name collisions.\nfunction hasRuneNameCollision(source) {\n  return /\\b(let|const|var)\\s+(props|derived|bindable)\\b/.test(source);\n}\nif (hasRuneNameCollision(componentSource)) {\n  // rename before migrating\n}","typeGuard":null,"tryCatchPattern":"// migrate() never throws MigrationError — it returns code with a marker comment.\nconst { code } = migrate({ filename, source });\nif (code.startsWith('<!-- @migration-task')) {\n  // inspect the embedded message and finish migration by hand\n}","preventionTips":["Avoid naming component variables `props`, `derived`, or `bindable` — reserve them for runes.","Run a grep for `\\b(props|derived|bindable)\\b` declarations before invoking the migrator.","Treat any `<!-- @migration-task -->` comment in migrate output as a required manual step."],"tags":["svelte5","migration","runes","naming-collision","codemod"],"backgroundTag":null,"analyzedSha":"20b341f10048cf1016a2028ac7eee5595cfef6a5","analyzedAt":"2026-08-12T23:37:30.399Z","schemaVersion":2},"datasetVersion":"2026-08-13T04:17:16.726Z"}