rollup output js files into folder

So i have this project where i will have a lot of components i want to output those into a build/components however i can’t seem to get it right:

My rollup file

import html from '@web/rollup-plugin-html';
import {copy} from '@web/rollup-plugin-copy';
import resolve from '@rollup/plugin-node-resolve';
import {terser} from 'rollup-plugin-terser';
import minifyHTML from 'rollup-plugin-minify-html-literals';
import summary from 'rollup-plugin-summary';

export default {
    plugins: [
        // Entry point for application build; can specify a glob to build multiple
        // HTML files for non-SPA app
        html({
            input: 'index.html',
        }),
        // Resolve bare module specifiers to relative paths
        resolve(),
        // Minify HTML template literals
        minifyHTML(),
        // Minify JS
        terser({
            ecma: 2020,
            module: true,
            warnings: true,
        }),
        // Print bundle summary
        summary(),
        // Optional: copy any static assets to build directory
        copy({
            patterns: ['images/**/*'],
        }),
    ],
    output: {
        dir: 'build',
    },
    preserveEntrySignatures: 'strict',
};

This outputs all of my files in the root next to the index.html with a seperate asset folder for some of the polyfills.

But how can i ensure that all my javascripts goes into a components folder?