Svelte-preprocess default option problems

[danitatt]

Hello everyone👋🏼 I really love svelte + svelte-preprocess for the ability to use the defaults option.

defaults: {
  markup: 'pug',
  script: 'coffee',
  style: 'sass'
}

But, when I use npm packages (e.g swiper/svelte), I get the error because the npm module is written in html/css/ js by default.
I get this same error when I use svelte-kit. Svelte-kit file generated without defaults and throws an error:
.svelte-kit/dev/generated/root.svelte

How can this problem be avoided? Maybe add option excludePaths? Where path node_modules & .svelte-kit exclude by default?

[PaHell]

Got the same problem. I'm using SvelteKit and everytime defaults: {} has been set, I get
`Error: /home/pat/Repos/heim/.svelte-kit/dev/generated/root.svelte:55:34
53| export let props_2 = null;
54|

55| setContext('svelte', stores);
-----------------------------------------^
56|
57| $: stores.page.set(page);
58| afterUpdate(stores.page.notify);

unexpected text ";

$"`

[kaisermann]

Hey, @danitatt 👋 We're discouraging the usage of the defaults options since it makes things much harder for tooling, so I'm not sure if adding a excludePaths would be the correct way forward. Adding an explicit lang=... is the most bug-guaranteed way to use other languages.

[benmccann]

It turns out this also causes issues with Vite's optimizeDeps. SvelteKit forced that off until the latest release (next.146). Now that we've allowed it on people's projects are failing to compile with errors like:

src/routes/products/[slug]/[id].svelte:4:13: error: Expected "from" but found "{"
    4 │   import type { LoadInput, LoadOutput } from '@sveltejs/kit/types/page';
      ╵               ^

Vite only looks at the script blocks and doesn't try to read the default:
https://github.com/vitejs/vite/blob/5c0f0a362f669e3d38ddc51bfdd9d424a7c08feb/packages/vite/src/node/optimizer/scan.ts#L32

I would really like to be able to set the default and argued in favor of it originally, but it does seem to be causing problems. I think we should either have svelte-preprocess start warning or throwing an error if default is provided to force people off of it or we need to put it somewhere easier for tooling to read like in package.json instead of svelte.config.js

Putting it in package.json would fix Problem 1 (#350 (comment)). I don't understand Problem 2 and if there's anything that can fix it including an explicit <script lang="ts">. Perhaps we can discuss this issue more with dummdidumm when he returns from vacation

[kaisermann]

have svelte-preprocess start warning or throwing an error if default

That we can do. Let's wait for @dummdidumm and decide the best move forward.

[AaronDDM]

@benmccann I am trying to understand the issue here, so have a few questions.

Is the issue here that vite is unable to distinguish what language is being used without an explicit lang tag? And is the assumption here that this is happening because projects are relying on different defaults (e.g. default ts), which vite is unaware of?

I am asking about the latter because I am getting the issue you described in your comment with no changes to my defaults and having the lang="ts" tag specified. After optimizeDeps was enabled, it seems like vite doesn't know that it needs to process TS code.

[benmccann]

Yes, for the Vite issue you need to specify lang="ts" on every <script> and <script context="module"> block because Vite isn't aware of the default. If you still have issues after doing that, please file a new issue with a reproduction in the SvelteKit repo and I'll take a look

[dummdidumm]

I'm in favor of logging a deprecation notice in the next minor and removing the functionality in the next major. While it feels nice to not have to write it every time, it introduces too many inconsistencies and maintenance burden all over the place, which hurts users of the default option more than it helps. The prettier/eslint plugin need to know it, language tools need to know it, now apparently vite needs to know it, too.
The main problem with the default is that most tooling still needs strictly synchronous paths, and the config file could be ESM which needs to be loaded asynchronously. Adding the default somewhere where loading is easier (package.json) would be a workaround but it would only shift the problem I think (every tool needs to update). Also, if we use the svelte field for that it would break other tooling which relies on this field to be a string.
Vue does not have this option AFAIK and I never saw an uproar about how badly they need it.

[jacob-8]

logging a deprecation notice

Yes, please do this soon! Would have saved me a lot of time trying to discern why builds on Vercel suddenly started failing but not on my local when I upgraded kit from v135 to v157. I couldn't find anything on this note anywhere until incrementally upgrading kit to v146 and reading the PR for it - sveltejs/kit#2137.

[kaisermann]

There we go #393

[kaisermann]

Deprecation notice released in 4.8.0 🎉