warn module variables are not reactive and make them truely non reactive

src/compiler/compile/Component.ts

@@ -1175,15 +1175,20 @@ export default class Component {
 	extract_reactive_declarations() {
 		const component = this;
 
-		const unsorted_reactive_declarations = [];
+		const unsorted_reactive_declarations: Array<{
+			assignees: Set<string>;
+			dependencies: Set<string>;
+			node: Node;
+			declaration: Node;
+		}> = [];
 
 		this.ast.instance.content.body.forEach(node => {
 			if (node.type === 'LabeledStatement' && node.label.name === '$') {
 				this.reactive_declaration_nodes.add(node);
 
-				const assignees = new Set();
+				const assignees = new Set<string>();
 				const assignee_nodes = new Set();
-				const dependencies = new Set();
+				const dependencies = new Set<string>();
 
 				let scope = this.instance_scope;
 				const map = this.instance_scope_map;
@@ -1214,10 +1219,22 @@ export default class Component {
 								const { name } = identifier;
 								const owner = scope.find_owner(name);
 								const variable = component.var_lookup.get(name);
-								if (variable) variable.is_reactive_dependency = true;
+								let should_add_as_dependency = true;
+
+								if (variable) {
+									variable.is_reactive_dependency = true;
+									if (variable.module) {
+										should_add_as_dependency = false;
+										component.warn(node as any, {
+											code: 'module-vars-not-reactive',
+											message: `"${name}" is a module variable, it will not be reactive`
+										});
+									}
+								}
 								const is_writable_or_mutated =
 									variable && (variable.writable || variable.mutated);
 								if (
+									should_add_as_dependency &&
 									(!owner || owner === component.instance_scope) &&
 									(name[0] === '$' || is_writable_or_mutated)
 								) {

test/runtime/samples/reactive-statement-module-vars/_config.js

@@ -0,0 +1,18 @@
+export default {
+	html: `
+		a: moduleA
+		b: moduleB
+		moduleA: moduleA
+		moduleB: moduleB
+	`,
+	async test({ assert, target, component }) {
+		await component.updateModuleA();
+
+		assert.htmlEqual(target.innerHTML, `
+			a: moduleA
+			b: moduleB
+			moduleA: moduleA
+			moduleB: moduleB		
+		`);
+	}
+};

test/runtime/samples/reactive-statement-module-vars/main.svelte

@@ -0,0 +1,15 @@
+<script context="module">
+  let moduleA = 'moduleA';
+	let moduleB = 'moduleB';
+</script>
+<script>
+	export function updateModuleA() {
+		moduleA = 'something else';
+	}
+	$: a = moduleA;
+	$: b = moduleB;
+</script>
+a: {a}
+b: {b}
+moduleA: {moduleA}
+moduleB: {moduleB}

test/validator/samples/reactive-module-variable/input.svelte

@@ -0,0 +1,6 @@
+<script context="module">
+  let foo;
+</script>
+<script>
+  $: bar = foo;
+</script>

test/validator/samples/reactive-module-variable/warnings.json

@@ -0,0 +1,17 @@
+[
+	{
+		"code": "module-vars-not-reactive",
+		"message": "\"foo\" is a module variable, it will not be reactive",
+		"pos": 67,
+		"start": {
+			"character": 67,
+			"column": 11,
+			"line": 5
+		},
+		"end": {
+			"character": 70,
+			"column": 14,
+			"line": 5
+		}
+	}
+]