fix logic for inclusion of getters/setters on components (32262)

src/compile/render-dom/index.ts

@@ -96,29 +96,28 @@ export default function dom(
 	props.forEach(x => {
 		const variable = component.var_lookup.get(x.name);
 
-		if (variable.hoistable) {
+		if (!variable.writable || component.component_options.accessors) {
 			body.push(deindent`
 				get ${x.export_name}() {
-					return ${x.name};
+					return ${x.hoistable ? x.name : 'this.$$.ctx.' + x.name};
 				}
 			`);
-		} else if (component.component_options.accessors) {
+		} else if (component.compile_options.dev) {
 			body.push(deindent`
 				get ${x.export_name}() {
-					return this.$$.ctx.${x.name};
+					throw new Error("<${component.tag}>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
 				}
 			`);
 		}
 
-		if (variable.writable && !renderer.readonly.has(x.export_name)) {
 		if (component.component_options.accessors) {
+			if (variable.writable && !renderer.readonly.has(x.name)) {
 				body.push(deindent`
 					set ${x.export_name}(${x.name}) {
 						this.$set({ ${x.name === x.export_name ? x.name : `${x.export_name}: ${x.name}`} });
 						@flush();
 					}
 				`);
-			}
 			} else if (component.compile_options.dev) {
 				body.push(deindent`
 					set ${x.export_name}(value) {
@@ -126,6 +125,13 @@ export default function dom(
 					}
 				`);
 			}
+		} else if (component.compile_options.dev) {
+			body.push(deindent`
+				set ${x.export_name}(value) {
+					throw new Error("<${component.tag}>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
+				}
+			`);
+		}
 	});
 
 	if (component.compile_options.dev) {