rollup.config.js

import vue from 'rollup-plugin-vue'
import scss from 'rollup-plugin-scss'

const pkg = require('./package.json')

function getAuthors(pkg) {
  const { contributors, author } = pkg

  const authors = new Set()
  if (contributors && contributors)
    contributors.forEach((contributor) => {
      authors.add(contributor.name)
    })
  if (author) authors.add(author.name)

  return Array.from(authors).join(', ')
}

const banner = `/*!
  * ${pkg.name} v${pkg.version}
  * (c) ${new Date().getFullYear()} ${getAuthors(pkg)}
  * @license ${pkg.license}
  */`

const outputConfigs = {
  // each file name has the format: `dist/${name}.${format}.js`
  // format being a key of this object
  'esm-bundler': {
    file: pkg.module,
    format: `es`,
  },
  cjs: {
    file: pkg.main,
    format: `cjs`,
  },
  global: {
    file: pkg.unpkg,
    format: `iife`,
  },
  esm: {
    file: pkg.browser || pkg.module.replace('-bundler.js', '-browser.js'),
    format: `es`,
  },
}

export default [
  // ESM build to be used with webpack/rollup.
  {
    input: 'src/index.js',
    output: {
      format: 'esm',
      file: pkg.module,
    },
    plugins: [vue()],
  },
  {
    input: 'src/scss/main.scss',
    output: {
      file: pkg.module,
      format: 'esm',
    },
    plugins: [scss()],
  },
  // SSR build.
  {
    input: 'src/index.js',
    output: {
      format: 'cjs',
      file: pkg.main,
    },
    plugins: [vue({ template: { optimizeSSR: true } })],
  },
]