svelte-preprocess: Svelte-preprocess default option problems

Add lang=".." to every script or style tag where it’s needed.

The examples are all using rollup. Any idea how the below config can be modified to work with snowpack?. If we remove the defaults and just use script lang="ts" in all the components, snowpack keeps throwing an “Unexpected token” error. Thanks.

module.exports = { preprocess: autoPreprocess({ defaults: { script: "typescript", }, postcss: true, }), };

Deprecation notice released in 4.8.0 🎉

@outloudvi Turns out there was just one file that was missing lang=“ts” and causing the build to fail. Your solution helped identify the file and fix the issue. Thanks a ton for the help.

@girishnuli, would you be able to add a line to node_modules/@snowpack/plugin-svelte/plugin.js to see which file triggers the error, and potentially have a look at it?

// probably near line 175 at @snowpack/plugin-svelte==3.7.0
console.log("---", filePath); // <-- add this to check which file has a problem on this
const compiled = svelte.compile(codeToCompile, finalCompileOptions);
const {js, css} = compiled;

(for myself, I realized one file where lang="ts" is absent in this way.)

No, the whole point of the deprecation message is to nudge you into not using it anymore, and there is no replacement, you should do lang="ts" in each file instead (note: if you have a module script and instance script, they both need that attribute) as this is way more robust for all the tooling out there (except snowpack apparently)

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

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 (https://github.com/sveltejs/svelte-preprocess/pull/350#issuecomment-842906506). 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

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.