Rollup Rollup is a module bundler for JavaScript which compiles small pieces of code into something larger and more complex, such as a library or application.

### Basic config

#### rollup.config.js

    export default {
      input: 'src/main.js',
      output: {
        file: 'bundle.js',
        format: 'cjs'
      }
    }

#### Terminal

    npm install -D rollup

Command | Description
--- | ---
`rollup -c -o bundle.js` | bundle using config
`rollup main.js --o bundle.js --f cjs` | bundle
`rollup --watch` | bundle continuously

You may need to use `./node_modules/.bin/rollup` as a command if you did not install rollup globally.

### Multiple outputs

#### rollup.config.js

    export default [
      {
        input: 'src/main.js',
        output: {
          file: __dirname + '/public/main.js',
          format: 'cjs',
          name: 'main'
        }
      },
      {
        input: 'src/vendor.js',
        output: {
          file: __dirname + 'public/vendor.js',
          format: 'cjs',
          name: 'vendor'
        }
      }
    ]

This creates `main.js` and `vendor.js`.

## Using plugins

### Plugins

#### Terminal

    npm install -D @rollup/plugin-json

#### rollup.config.js

    import json from '@rollup/plugin-json'

    export default {
      input: 'src/main.js',
      output: {
        file: 'bundle.js',
        format: 'cjs'
      },
      plugins: [ json() ]
    }

### npm packages

#### Terminal

    npm install -D @rollup/plugin-node-resolve

#### rollup.config.js

    import resolve from '@rollup/plugin-node-resolve'

    export default {
      input: 'src/main.js',
      output: {
        file: 'bundle.js',
        format: 'cjs'
      },
      plugins: [ resolve() ]
    }

When you run a npm run build, no warning is emitted and contains the imported modules.

### Peer dependencies

#### Terminal

    npm install -D @rollup/plugin-node-resolve

#### rollup.config.js

    import resolve from '@rollup/plugin-node-resolve'

    export default {
      input: 'src/main.js',
      output: {
        file: 'bundle.js',
        format: 'cjs'
      },
      plugins: [resolve({
        // pass custom options to the resolve plugin
        customResolveOptions: {
          moduleDirectory: 'node_modules'
        }
      })],
      // indicate which modules should be treated as external
      external: ['lodash']
    }

### Babel

#### Terminal

    npm install -D rollup-plugin-babel

#### rollup.config.js

    import resolve from '@rollup/plugin-node-resolve'
    import babel from 'rollup-plugin-babel'

    export default {
      input: 'src/main.js',
      output: {
        file: 'bundle.js',
        format: 'cjs'
      },
      plugins: [
        resolve(),
        babel({
          exclude: 'node_modules/**' // only transpile our source code
        })
      ]
    }

#### src/.babelrc

    {
      "presets": [
        ["latest", {
          "es2015": {
            "modules": false
          }
        }]
      ],
      "plugins": ["external-helpers"]
    }

0 Comments for this cheatsheet. Write yours!