Example Rollup config file for building React components using Typescript.

index.tsx

import React from 'react';
import * as ReactDOM from 'react-dom';

export default class HQueue extends React.Component<any, any> {
  constructor(props: any) {
    super(props);
  }

  public componentDidMount() {
  }

  public render() {
    return (
      <div>
        Hello world!
      </div>
    )
  }
}

// We call it like this ->
// ReactDOM.render(<HQueue />, document.getElementById('app'));

rollup.config.js

/*
 * Example Rollup config file for building React components using Typescript.
 * Compile using 'rollup -c'
 */
var typescript = require('rollup-plugin-typescript');
var ts = require('typescript');
var resolve = require('rollup-plugin-node-resolve');
var commonjs = require('rollup-plugin-commonjs');
var replace = require('rollup-plugin-replace');
var uglify = require('rollup-plugin-uglify');
var buble = require('rollup-plugin-buble');

module.exports = {
    entry: 'src/index.tsx',
    dest: 'dist/index.js',
    format: 'iife',
    moduleName: 'supercoolnamehere',
    plugins: [
      replace({
        'process.env.NODE_ENV': JSON.stringify( 'production' )
      }),
      typescript({
        target: "es2015",
        jsx: "react"
      }),
      resolve({ 
        jsnext: true,
        main: true,
        browser: true
      }),
      buble(),
      commonjs({
        include: [
          'node_modules/**'
        ],
        namedExports: {
          'node_modules/react/react.js': ['Children', 'Component', 'PropTypes', 'createElement'],
          'node_modules/react-dom/index.js': ['render']
        }
      }),
      uglify()
    ]
};