Compiler should explicitly disallow `var` in reactive block scope

[Conduitry]

Describe the problem

The compiler currently throws an opaque error when using a var inside a reactive block:

<script>
	$: {
		var now = new Date();
	}
</script>

(Error: Not implemented undefined)

The above code compiles in 3.40.3 but not in 3.41.0. Even in 3.40.3, it could easily lead to invalid code, because something like

<script>
	$: {
		var now = new Date();
	}
	now = 'foo';
</script>

would compile, but then the now reference outside the reactive block would fail because, in the compiled code, the declaration ends up inside a function, which does stop the var from leaking into the outer scope.

Even if we could get this to compile and to produce something correct, it would (a) probably be a lot of work for nothing, and (b) would enable people to write very confusing code.

Describe the proposed solution

vars inside a reactive block should be explicitly disallowed by the compiler. Note that if there are nested blocks inside the reactive block, vars should also be forbidden in there, but if there's a function inside the block, vars should be allowed there.

Alternatives considered

Do nothing. I don't think this is preventing any valid components from compiling, but it would certainly help to have a legible error message that pointed to the var in question.

Importance

nice to have

[RaiVaibhav]

I would love to take this issue up, would be helpful if someone can guide 👍

[RaiVaibhav]

Hey, @Conduitry in relation to your statement Note that if there are nested blocks inside the reactive block, vars should also be forbidden in there, you were talking about case something like this?

<script>
	$: {
		for(var i=0; i<5; i++) {
			console.log(i);
		}
	}
</script>
<h1>Hello world!</h1>

[Conduitry]

That would be one type of disallowed situation. In general, anything where the var's scope would extend outside the reactive block.