rollup.config.js

import path from "path";
import resolve from "rollup-plugin-node-resolve";
import { terser } from "rollup-plugin-terser";
import typescript from "rollup-plugin-typescript";
import babel from "rollup-plugin-babel";

const shouldMinify = process.env.NODE_ENV === "production";
const bundle = ["tslib"];

export default {
  input: "./src/index.ts",
  output: [
    {
      dir: "dist/esm",
      format: "esm",
      globals: {
        react: "React",
        "react-dom": "ReactDOM"
      }
    },
    {
      dir: "dist/cjs",
      format: "cjs"
    }
  ],
  external: id => {
    return !id.startsWith(".") && !path.isAbsolute(id) && !bundle.includes(id);
  },
  plugins: [
    resolve(),
    typescript(),
    babel({
      presets: [
        ["@babel/preset-typescript"],
        [
          "@babel/preset-env",
          {
            modules: false,
            targets: {
              browsers: [">0.25%, not dead"]
            }
          }
        ]
      ],
      plugins: [
        "@babel/proposal-class-properties",
        "@babel/proposal-object-rest-spread"
      ]
    }),
    shouldMinify &&
      terser({
        sourcemap: true,
        output: { comments: "some" },
        compress: {
          keep_infinity: true,
          pure_getters: true,
          passes: 10
        },
        ecma: 5,
        warnings: true,
        mangle: {
          reserved: ["Canvas"]
        }
      })
  ]
};