testdrive-jsui/rollup.config.js

import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import babel from '@rollup/plugin-babel';
import terser from '@rollup/plugin-terser';
import postcss from 'rollup-plugin-postcss';
import postcssImport from 'postcss-import';
import autoprefixer from 'autoprefixer';
import cssnano from 'cssnano';

const production = !process.env.ROLLUP_WATCH;

// Shared Babel config
const babelConfig = {
  babelHelpers: 'bundled',
  exclude: 'node_modules/**',
  presets: [
    ['@babel/preset-env', {
      targets: {
        browsers: ['> 0.5%', 'last 2 versions', 'not dead']
      }
    }]
  ]
};

// Shared plugins (without CSS)
const getPluginsWithoutCSS = () => [
  resolve({ browser: true }),
  commonjs(),
  babel(babelConfig),
  // PostCSS but don't extract (CSS already extracted in first build)
  postcss({
    inject: false,  // Don't inject or extract, just process
    extract: false
  })
];

export default [
  // UMD build (browser-friendly, default) - EXTRACTS CSS
  {
    input: 'src/index.js',
    output: {
      name: 'TestDriveJSUI',
      file: 'dist/testdrive-jsui.js',
      format: 'umd',
      sourcemap: true,
      exports: 'named',  // Fix mixing named/default exports warning
      globals: {
        marked: 'marked'
      },
      banner: `/*!
 * TestDrive-JSUI v1.0.0
 * JavaScript-first markdown editor library
 * (c) 2025 MarkiTect Team
 * Released under MIT License
 */`
    },
    external: ['marked'], // Peer dependency
    plugins: [
      resolve({ browser: true }),
      commonjs(),
      babel(babelConfig),
      postcss({
        extract: 'testdrive-jsui.css',  // Extract CSS to separate file
        minimize: production,
        plugins: [
          postcssImport(),  // Resolve @import statements first
          autoprefixer(),
          production && cssnano()
        ].filter(Boolean),
        sourceMap: true
      })
    ]
  },

  // UMD minified build
  {
    input: 'src/index.js',
    output: {
      name: 'TestDriveJSUI',
      file: 'dist/testdrive-jsui.min.js',
      format: 'umd',
      sourcemap: true,
      exports: 'named',
      globals: {
        marked: 'marked'
      }
    },
    external: ['marked'],
    plugins: [
      ...getPluginsWithoutCSS(),
      terser({
        format: {
          comments: /^!/
        }
      })
    ]
  },

  // ESM build (for modern bundlers)
  {
    input: 'src/index.js',
    output: {
      file: 'dist/testdrive-jsui.esm.js',
      format: 'esm',
      sourcemap: true
    },
    external: ['marked'],
    plugins: getPluginsWithoutCSS()
  },

  // CommonJS build (for Node.js)
  {
    input: 'src/index.js',
    output: {
      file: 'dist/testdrive-jsui.cjs.js',
      format: 'cjs',
      sourcemap: true,
      exports: 'named'
    },
    external: ['marked'],
    plugins: getPluginsWithoutCSS()
  }
];