sveltejs / svelte-preprocess

A ✨ magical ✨ Svelte preprocessor with sensible defaults and support for: PostCSS, SCSS, Less, Stylus, Coffeescript, TypeScript, Pug and much more.
MIT License
1.73k stars 147 forks source link

compile errors when typechecking `svelte.config.js` with `moduleResolution` set to `nodenext` #591

Closed DetachHead closed 3 weeks ago

DetachHead commented 1 year ago

Describe the bug when typechecking svelte.config.js with moduleResolution set to nodenext, the following compile errors occur:

node_modules/svelte-preprocess/dist/types/index.d.ts:2:106 - error TS2307: Cannot find module 'svelte/types/compiler/preprocess' or its corresponding type declarations.

2 import type { Processed as SvelteProcessed, Preprocessor as SveltePreprocessor, PreprocessorGroup } from 'svelte/types/compiler/preprocess';
                                                                                                           ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/svelte-preprocess/dist/types/index.d.ts:4:35 - error TS2307: Cannot find module 'svelte/types/compiler/preprocess' or its corresponding type declarations.

4 export { PreprocessorGroup } from 'svelte/types/compiler/preprocess';
                                    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
svelte.config.js:12:14 - error TS2349: This expression is not callable.
  Type 'typeof import("/home/projects/sveltejs-kit-template-default-b9wpnr/node_modules/svelte-preprocess/dist/index")' has no call signatures.

12  preprocess: preprocess()
                ~~~~~~~~~~

Logs Please include browser console and server logs around the time this bug occurred.

To Reproduce

  1. go to https://stackblitz.com/edit/sveltejs-kit-template-default-b9wpnr?file=svelte.config.js
  2. wait for the dev npm script to finish
  3. check the output

Expected behavior A clear and concise description of what you expected to happen.

Information about your project:

Additional context

other related issues:

DetachHead commented 9 months ago
minimized comment, off topic

this also causes two even more severe issues: # compile errors when trying to import another svelte component ```svelte ``` ``` > svelte-kit sync && svelte-check --tsconfig ./tsconfig.json ==================================== Loading svelte-check in workspace: c:\Users\user\Documents\my-app2 Getting Svelte diagnostics... c:\Users\user\Documents\my-app2\src\routes\+page.svelte:5:1 Warn: 'Foo' is not defined (svelte) ==================================== svelte-check found 0 errors and 1 warning in 1 file ``` also why is an undefined variable only a warning instead of an error? # runtime crash attempting to run my app with `moduleResolution` set to `NodeNext` causes this error: ``` ReferenceError: exports is not defined at eval (C:/Users/user/Documents/my-app2/src/routes/+page.svelte:14:24) at Object.$$render (C:/Users/user/Documents/my-app2/node_modules/svelte/src/runtime/internal/ssr.js:174:16) at Object.default (C:/Users/user/Documents/my-app2/.svelte-kit/generated/root.svelte:74:138) at eval (C:/Users/user/Documents/my-app2/node_modules/@sveltejs/kit/src/runtime/components/layout.svelte:8:41) at Object.$$render (C:/Users/user/Documents/my-app2/node_modules/svelte/src/runtime/internal/ssr.js:174:16) at eval (C:/Users/user/Documents/my-app2/.svelte-kit/generated/root.svelte:63:129) at $$render (C:/Users/user/Documents/my-app2/node_modules/svelte/src/runtime/internal/ssr.js:174:16) at Object.render (C:/Users/user/Documents/my-app2/node_modules/svelte/src/runtime/internal/ssr.js:182:17) at Module.render_response (C:/Users/user/Documents/my-app2/node_modules/@sveltejs/kit/src/runtime/server/page/render.js:185:29) at async Module.render_page (C:/Users/user/Documents/my-app2/node_modules/@sveltejs/kit/src/runtime/server/page/index.js:295:10) ```

dummdidumm commented 9 months ago

Could you provide a reproduction for this? This sounds a bit unrelated - moduleResolution shouldn't have impact on how things are resolved at runtime, unless Vite is doing something funky there.

DetachHead commented 9 months ago

yeah i can't reproduce that anymore updating to typescript 5, must've been the same issue as #612

however the issue in the OP still occurs

dummdidumm commented 3 weeks ago

Fixed as part of #640

AlexAegis commented 2 weeks ago

I'm still getting it

src/internal/configurations.js:12:14 - error TS2349: This expression is not callable.
  Type 'typeof import("/home/alex/git/@aa/js-tooling/node_modules/.pnpm/svelte-preprocess@6.0.0_postcss-load-config@6.0.1_postcss@8.4.38__postcss@8.4.38_svelte@4.2.18_typescript@5.4.5/node_modules/svelte-preprocess/dist/index")' has no call signatures.

12  preprocess: sveltePreprocess(),
                ~~~~~~~~~~~~~~~~

When trying to import the default import.

import { default as sveltePreprocess } from 'svelte-preprocess';

/**
 * @type {import('./types.js').Config}
 */
export const libConfiguration = {
    preprocess: sveltePreprocess(),
};

I think this happened before 6.0.0 too but I was just importing it from inside the package

import { sveltePreprocess } from 'svelte-preprocess/dist/autoProcess.js';

But I can no longer do this (since the exports object was defined in this versions package.json)

src/internal/configurations.js:4:34 - error TS2307: Cannot find module 'svelte-preprocess/dist/autoProcess.js' or its corresponding type declarations.

4 import { sveltePreprocess } from 'svelte-preprocess/dist/autoProcess.js';
                                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Relevant TSConfig:

{
    "compilerOptions": {
        "moduleResolution": "NodeNext",
        "module": "NodeNext"
    }
}

It would be nice to just have this export also exported as a named export. Default exports are such a headache sometimes..

With "moduleResolution": "Bundler", it works as intended

For now I can just // @ts-ignore it

dummdidumm commented 2 weeks ago

If you do import sveltePreprocess from 'svelte-preprocess' everything should work as intended.

AlexAegis commented 2 weeks ago

No, I tried that too, forgot to mention. image

dummdidumm commented 2 weeks ago

In 6.0.1 you can now do import { sveltePreprocess } from 'svelte-preprocess' which should work with NodeNext, too