enhance enhanceCompileError to report when no svelte config was found

[maxlath]

Describe the problem

Hi!

I have been struggling with migrating a Svelte project from webpack to vite, and finally came to a breakthrough when I realized my svelte.config.js had to be moved to a different directory (./app instead of .) to be detected by vite/vite-plugin-svelte

---

For the sake of making that issue easier to find by people going on the same road, here is the kind of error message I was getting with my config in the wrong place:

error during build:
[vite-plugin-svelte] [plugin vite-plugin-svelte] app/path/to/component.svelte (89:2): app/path/to/component.svelte:89:2 Expected a valid CSS identifier
https://svelte.dev/e/css_expected_identifier

- Did you forget to add a scss preprocessor? See https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/preprocess.md for more information.

Describe the proposed solution

enhanceCompileError was reporting that no preprocessor was set, but would have saved me a good amount of banging my head on the wall had it told me that no config was found at all.

Also logging the path where the config file would be expected would be great (my breakthrough came after I ran vite --debug and realized that vite was looking for env files in ./app)

Alternatives considered

Giving up and becoming a goat keeper

Importance

would make my life easier

[maxlath]

I now realize I could have found that info by running export DEBUG=vite-plugin-svelte:* ; vite. Is there maybe a way to enable vite-plugin-svelte debug logs when running vite --debug?

[dominikg]

DEBUG="vite-plugin-svelte:* vite:*" vite --debug maybe? both use the npm package debug but different namespaces.

[maxlath]

I was more thinking from the point of view of a user who doesn't know about the DEBUG environment variable, but finds the --debug option in the vite help (which was my case), and runs vite --debug: it would currently not log any of the vite-plugin-svelte debug logs.

[maxlath]

I tried to see if that was possible to detect the --debug flag from the plugin, but couldn't make it work

export function svelte(inlineOptions) {
	// Not using node:util parseArgs, as that makes vite exit without doing anything
	const args = process.argv.slice(2);
	let arg, debugFlag, debugNamespace;
	while (arg = args.shift()) {
		if (arg === '-d' || arg === '--debug') {
			debugFlag = true;
			const nextArg = args[0];
			if (nextArg && !nextArg.startsWith('-')) {
				debugNamespace = nextArg;
			}
			break;
		}
	}
	if (process.env.DEBUG != null || debugFlag) {
		log.setLevel('debug');
	}
        log.debug('hello?', undefined, 'config') // Doesn't log anything

[dominikg]

In an early version, vite plugin svelte used to prefix its debug logs with vite:vite-plugin-svelte: but that made it a bit more complicated to focus and kind of encroaching on vites namespace.

This would be a good discussion to have on vite discord in regards to how plugins can organically participate in debug logging, maybe even vite exposing its debug instance so we can skip bringing our own.

In the meantime, do you think it would help adding a FAQ item about the debug flag here https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/faq.md ?

[maxlath]

I made a FAQ proposition here #1167

[dominikg]

There have been more occurences of misplaced config files, to surface that not only in case of an error, #1179 increases the loglevel for that.