risk-ladder/rollup.config.js

import autoprefixer from 'autoprefixer';
import babel from '@rollup/plugin-babel';
import browsersync from 'rollup-plugin-browsersync';
import commonjs from '@rollup/plugin-commonjs';
import copy from 'rollup-plugin-copy';
import cssnano from 'cssnano';
import del from 'rollup-plugin-delete';
import { eslint } from 'rollup-plugin-eslint';
import json from 'rollup-plugin-json';
import path from 'path';
import postcss from 'rollup-plugin-postcss';
import resolve from '@rollup/plugin-node-resolve';
import sourcemaps from 'rollup-plugin-sourcemaps';
import stylelint from 'stylelint';
import { terser } from 'rollup-plugin-terser';

import config from './build.json';

const printWarning = (message) => {
    if (message.code === 'CIRCULAR_DEPENDENCY') {
        return;
    }
    console.error(message);  // eslint-disable-line
};


const generateConfiguration = (target, option) => {

    target = target === undefined ? 'development' : target;

    // Common postcs configruation for development and production build.
    let postcssconf = {
        extract: true,
        plugins: [
            autoprefixer(),
            stylelint(),
            (target === 'production' && cssnano())
        ],
    };

    // Browsersync configruation
    let browsersyncconf = {
        server: {
            baseDir: config.path.output,
            index: config.html.index.name,  // first html file in array is served as index
        },
        watch: true,
    };

    // Default rollup plugins
    const plugins = {
        development: [sourcemaps()],
        production: [terser()],
        prepare: [
            (option !== 'serve' && del({ targets: [path.join(config.path.output, '/*'), path.join(config.path.build, '/*')] })),
            resolve({browser: true}),
            commonjs(),
            json(),
            eslint({
                extends: ['plugin:json/recommended', 'eslint:recommended'],
                exclude: [path.join(config.path.input, config.path.css, '/**'), 'html/**']
            }),
            babel({ babelHelpers: 'bundled' }),
        ],
        postProcess: [
            postcss(postcssconf),
            copy({
                targets: [
                    { src: path.join(config.path.build, '/*.css'), dest: path.join(config.path.output, config.path.css) },
                    { src: path.join(config.path.build, '/*.js*'), dest: path.join(config.path.output, config.path.js) },
                    { src: path.join(config.path.assets, config.path.js), dest: config.path.output },
                    { src: path.join(config.path.assets, config.path.css), dest: config.path.output },
                    { src: path.join(config.path.assets, config.path.img), dest: config.path.output },
                    { src: path.join(config.path.assets, config.path.fonts), dest: config.path.output },
                ],
                hook: 'writeBundle',
                verbose: true
            }),
            (option === 'serve' && browsersync(browsersyncconf))
        ]
    };

    let rconf = {
        onwarn: printWarning,
        input: path.join(config.path.input, config.path.js, `${config.main}.js`),
        plugins: plugins.prepare.concat(plugins[target], plugins.postProcess),  // Concatenate plugin arrays
        output: {
            file: path.join(
                config.path.build,
                `${config.main}${config[target].infix}.js`
            ),
            format: 'iife',
            sourcemap: config[target].sourcemap
        }
    };
    return rconf;
};

const rollup_config = generateConfiguration(process.env.NODE_ENV, process.env.NODE_OPT);

export default rollup_config;