chore(deps): use vite-plugin-svelte 4 in svelte5 template of create-svelte

[dominikg]

this helps to avoid a peer warning during npm install where vite-plugin-svelte@3 still depends on svelte-hmr for svelte4 support, but svelte-hmr does not have a peer range supporting svelte5 (it can't, hmr support is built into svelte5 instead).

Also svelte5 users should use vite-plugin-svelte@4 because that has better support.

---

Please don't delete this checklist! Before submitting the PR, please make sure you do the following:

• It's really useful if your PR references an issue where it is discussed ahead of time. In many cases, features are absent for a reason. For large changes, please create an RFC: https://github.com/sveltejs/rfcs
• This message body should clearly illustrate what problems it solves.
• Ideally, include a test that fails without this PR but passes with it.

Tests

• Run the tests with pnpm test and lint the project with pnpm lint and pnpm check

Changesets

• If your PR makes a change that should be noted in one or more packages' changelogs, generate a changeset by running pnpm changeset and following the prompts. Changesets that add features should be minor and those that fix bugs should be patch. Please prefix changeset messages with feat:, fix:, or chore:.

Edits

• Please ensure that 'Allow edits from maintainers' is checked. PRs without this option may be closed.

[changeset-bot]

🦋 Changeset detected

Latest commit: c7d3ea7

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
create-svelte	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[dominikg]

Added svelte5 to create-svelte tests and lint is failing in created projects for array reactivity in sverdle

https://github.com/sveltejs/kit/actions/runs/10439353949/job/28907856687?pr=12586#step:8:111

[benmccann]

thanks!!

[benmccann]

Added svelte5 to create-svelte tests and lint is failing in created projects for array reactivity in sverdle

Oh, yeah, I guess we'll have to fix that. I might have missed the error in the logs, but all I see is:

   ❯ test/check.js  (52 tests | 2 failed) 85441ms
     × lint > default-checkjs-svelte5
       → Command failed: pnpm lint
  
     × lint > default-typescript-svelte5
       → Command failed: pnpm lint

It'd be nice if it showed how it failed

We could simply revert the changes to check.js for an easy fix. It's a pretty short-term thing that we'll have multiple versions of Svelte in the CLI, so I'm not as worried about making sure we test both of them

[dominikg]

iirc the logs were too verbose, this is what it logs locally:

/home/xxxx/develop/sveltejs/kit/.test-tmp/create-svelte/default-checkjs-svelte5/src/routes/sverdle/+page.svelte
  47:20  error  Properties of objects and arrays are not reactive unless in runes mode. Changes to this property will not cause the reactive statement to update(reactive_declaration_non_reactive_property)  svelte/valid-compile

[dominikg]

maybe it's possible to change the code in question so it works without this error? I think it is important that create-svelte creates working projects in all permutations

[benmccann]

Oh yeah. If it's an issue affecting whether it works we'll have to fix it. I thought it was just a style issue

[AdrianGonz97]

the error does look like it's a false positive though:

	$: {
		classnames = {};
		description = {};

		data.answers.forEach((answer, i) => {
			const guess = data.guesses[i];

			for (let i = 0; i < 5; i += 1) {
				// Properties of objects and arrays are not reactive unless in runes mode.
				// Changes to this property will not cause the reactive statement to
				// update(reactive_declaration_non_reactive_property) eslint(svelte/valid-compile)
				const letter = guess[i];
				//             ^^^^^^^^

				if (answer[i] === "x") {
					classnames[letter] = "exact";
					description[letter] = "correct";
				} else if (!classnames[letter]) {
					classnames[letter] = answer[i] === "c" ? "close" : "missing";
					description[letter] = answer[i] === "c" ? "present" : "absent";
				}
			}
		});
	}

the project builds and works as expected too

edit: the description of the error isn't wrong, but it seems more like it's wrongly presented as an error instead of a warning

[dominikg]

We probably want the whole sverdle refactored to make use of runes as a showcase for svelte5.

cc @Rich-Harris

[dummdidumm]

Was introduced through sveltejs/svelte#12824, I personally think this will cause to many false positives and needs to be tweaked / reverted, but we'll see. Either way it's unrelated to this PR