How to use @open-wc/building-rollup - 3 common examples

import { createDefaultConfig } from '@open-wc/building-rollup';
import commonjs from 'rollup-plugin-commonjs';
import resolve from 'rollup-plugin-node-resolve';
import json from 'rollup-plugin-json';
import builtins from 'rollup-plugin-node-builtins';
import globals from 'rollup-plugin-node-globals';
import replace from 'rollup-plugin-replace';

const config = createDefaultConfig({ input: './index.html' });

// map if you use an array of configs, otherwise just extend the config
export default {
  ...config,
  plugins: [
    replace({
      'process.env.NODE_ENV': JSON.stringify('development')
    }),
    resolve({ browser: true }),
    // Allow bundling cjs modules (unlike webpack, rollup doesn't understand cjs)
    commonjs(),
    ...config.plugins,
    // Allow json resolution
    json()
  ],
  external: [],

async function buildPreview(outputDir, assets) {
  const configs = createCompatibilityConfig({
    input: 'noop',
    extensions: [...DEFAULT_EXTENSIONS, 'mdx'],
    plugins: { indexHTML: false },
  });

  configs[0].output.dir = path.join(outputDir, 'legacy');
  configs[1].output.dir = outputDir;

  configs[0].plugins.unshift(
    indexHTML({
      indexFilename: 'iframe.html',
      indexHTMLString: assets.iframeHTML,
      multiBuild: true,
      legacy: true,
      polyfills: {
        dynamicImport: true,

import cpy from 'rollup-plugin-cpy';
import { createDefaultConfig } from '@open-wc/building-rollup';

const config = createDefaultConfig({
  input: './demo/index.html',
  indexHTMLPlugin: {
    minify: false
  }
});

export default {
  ...config,
  plugins: [
    ...config.plugins,
    cpy({
      files: ['demo/*.css'],
      dest: 'dist'
    })
  ]
};