egoist / egoist/tsup

Svelte compilation error with tsup: "Invalid compiler option: The boolean options have been removed from the css option"

Open
#1,305 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
11.3k
Forks
274
PR merge metrics
No merged PRs in 30d

Description

## Description

Hello,

I encountered an error when trying to build my Svelte project using `tsup`. The error message is:

```
✘ [ERROR] Invalid compiler option: The boolean options have been removed from the css option.
Use "external" instead of false and "injected" instead of true
https://svelte.dev/e/options_invalid_value [plugin svelte]

src/index.ts:1:44:
1 │ export { default as ProgressProvider } from './progress-provider.svelte';
╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~
```

This error suggests that the `css` option in Svelte's compiler should no longer be a boolean value, but rather `"external"` or `"injected"`.

## Steps to Reproduce

1. Set up a Svelte project with TypeScript.
2. Install `tsup` for bundling.
3. Attempt to build the project using tsup.

## Configuration

`tsup.config.ts` :
```ts
import { defineConfig } from 'tsup';
import esbuildSvelte from 'esbuild-svelte';
import { sveltePreprocess } from 'svelte-preprocess';

export default defineConfig({
entry: ['src/index.ts'],
format: ['esm', 'cjs'],
sourcemap: true,
dts: true,
esbuildPlugins: [
esbuildSvelte({
preprocess: sveltePreprocess(),
compilerOptions: {
css: 'external',
},
}),
],
external: ['svelte', '@bprogress/core'],
});
```

## Additional Details

### Versions:
- tsup: `8.3.6`
- svelte: `5.19.9`
- esbuild-svelte: `0.9.0`
- svelte-preprocess: `6.0.3`

Despite attempting to fix the issue by explicitly setting `css: 'external'` in `compilerOptions`, the error persists.
It seems that `tsup` or `esbuild-svelte` is still using a boolean value for the `css` option, which is no longer valid in recent versions of Svelte.

Contributor guide

Open the contributing guide

Research direction

Start with the reported tsup.config.ts and the Svelte entry point at src/index.ts, then inspect how esbuild-svelte 0.9.0 passes compilerOptions to Svelte 5. Reproduce the build with the listed versions and trace whether the boolean css option is introduced by tsup or esbuild-svelte; done means the example builds without the invalid compiler-option error.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
build-system
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.