rollup.config.js

// root/rollup.config.js

import babel from '@rollup/plugin-babel';
import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import postcss from 'rollup-plugin-postcss';

export default {
    input: 'src/index.js',
    output: [
        {
            file: 'dist/index.js',
            format: 'cjs',
            sourcemap: true
        },
        {
            file: 'dist/index.esm.js',
            format: 'esm',
            sourcemap: true
        }
    ],
    plugins: [
        postcss({
            inject: true,   // This ensures CSS is bundled into the JS file
            minimize: true
        }),
        resolve({
            extensions: ['.js', '.jsx', '.ts', '.tsx']
        }),
        babel({
            babelHelpers: 'bundled',
            exclude: 'node_modules/**',
            presets: ['@babel/preset-env', '@babel/preset-react'],
            extensions: ['.js', '.jsx', '.ts', '.tsx']
        }),
        commonjs()
    ],
    external: ['react', 'react-dom']
};