I'm using svelte compoenents in some pages of myapp. the directory tree is like:

-myapp
--controller
--static
--svelte

I have manged to setup svelte to ouput js bundle to myapp/static/js/ by modifying rollup.config.js:

export default {
    input: 'src/main.js',
    output: {
        sourcemap: true,
        format: 'iife',
        name: 'app',
        file: '../static/js/bundle.js'

However the styles in components is also saved in myapp/static/js which is not very idomatic. So I want to change the location to myapp/static/css

Currently css is defined as:

plugins: [
    svelte({
        compilerOptions: {
            // enable run-time checks when not in production
            dev: !production
        }
    }),
    css({ output: 'bundle.css' }),

I tried things like:

css({  
    output: {
        file: '../static/css/bundle.css'
    },          
 }),

But I get this error:

bundles src/main.js → ../static/js/bundle.js...
[!] (plugin css) Error: The "fileName" or "name" properties of emitted files must be strings that are neither absolute nor relative paths, received "../static/js/bundle.css".

So I'm wondering what is the correct way to do that?