Named export 'sass' not found

[basaran]

Describe the bug I'm trying to import and configure preprocessor manually.

To Reproduce

Repo: https://github.com/basaran/prep-issue

pnpm install -D svelte-preprocess;

then import in svelte.config.js

import { sass } from "svelte-preprocess";

Expected behavior I was able to import like this with a standard svelte project.

Stacktraces

If you have a stack trace to include, we recommend putting inside a <details> block for the sake of the thread's readability:

Stack trace

file:///home/michael/websites/prep/svelte.config.js:1 import { sass } from "svelte-preprocess"; ^^^^ SyntaxError: Named export 'sass' not found. The requested module 'svelte-preprocess' is a CommonJS module, which may not support all module.exports as named exports. CommonJS modules can always be imported via the default export, for example using:

import pkg from 'svelte-preprocess'; const { sass } = pkg;

at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
at async ModuleJob.run (node:internal/modules/esm/module_job:179:5)
at async Loader.import (node:internal/modules/esm/loader:178:24)
at async load_config (file:///home/michael/websites/prep/node_modules/.pnpm/@[email protected][email protected]/node_modules/@sveltejs/kit/dist/cli.js:697:17)
at async get_config (file:///home/michael/websites/prep/node_modules/.pnpm/@[email protected][email protected]/node_modules/@sveltejs/kit/dist/cli.js:769:10)
at async file:///home/michael/websites/prep/node_modules/.pnpm/@[email protected][email protected]/node_modules/@sveltejs/kit/dist/cli.js:831:18

Information about your project:

• node v16.10.0
• 4.9.8
• Rollup

[HeyITGuyFixIt]

I'm experiencing the same issue but with postcss

[compeek]

I'm experiencing the same in a SvelteKit project. I've found that using the default import (e.g. import sveltePreprocess from 'svelte-preprocess';) and then calling the preprocessor method off of that (e.g. sveltePreprocess.sass()) works, but I don't like to have to do that since I should be able to use the ESM-style import (if I'm saying that correctly).

[felixsanz]

bump! happened to me too

[mattpilott]

I've run into this today and tracking back through the code it seems as though import { scss } from 'svelte-preprocess' should work.

SyntaxError: Named export 'scss' not found. The requested module 'svelte-preprocess' is a CommonJS module, which may not support all module.exports as named exports.

[muratgozel]

hey, looks like this module only supports commonjs, remove "type": "module" from the package.json if you can.

[Aoshisen]

some issue happened to me

[Aoshisen]

some issue happened to me

[basaran]

It seems vitePreprocess is becoming the norm these days. In the meantime, this is an option for destructuring assignment. Just not at the esm import.

import sveltePreprocess from 'svelte-preprocess';
const { sass } = sveltePreprocess;