modes/index.js dynamic require breaks rollup

mapbox-gl-js version: 0.48.0
mapbox-gl-draw version: 1.0.9

I'm trying to add mapbox-gl-draw to my project which uses rollup, but the require call in modes/index.js blocks it from working.

Lines 10 to 14 in modes/index.js don't seem to add any functionality as far as I can tell, but they break the rollup-plugin-commonjs plugin because it thinks it needs to do require() during runtime. Removing the lines resolves this issue.

The error message as thrown by the compiled code: Dynamic requires are not currently supported by rollup-plugin-commonjs.

(Note that I shimmed out geojsonhint, but that is because it expects fs to exist, and I'm not using the functionality it is required for.)

My rollup config:

import cjs from 'rollup-plugin-commonjs';
import node from 'rollup-plugin-node-resolve';
import replace from 'rollup-plugin-replace';
import json from 'rollup-plugin-json';
import vue from 'rollup-plugin-vue';
import postcss from 'rollup-plugin-postcss';

const production = !process.env.ROLLUP_WATCH;

const plugins = [
    cjs(),
    node({
        browser: true,
        preferBuiltins: false
    }),
    json({
        preferConst: true
    }),
    replace({
        'process.env.NODE_ENV': JSON.stringify(production ? 'production' : 'development'),
        'process.env.VUE_ENV': JSON.stringify('browser')
    }),
    vue(),
    postcss({
        extract: true
    })
];

if (!production) {
    const livereload = require('rollup-plugin-livereload');
    plugins.push(livereload({watch: 'public'}));
}

export default {
    input: 'src/main.js',
    external: ['@mapbox/geojsonhint'],
    output: {
        file: 'public/main.js',
        format: 'iife',
        sourcemap: false,
        globals: {
            '@mapbox/geojsonhint': '_geojsonhintShim'
        }
    },
    plugins
};

package.json:

{
  "dependencies": {
    "@johmun/vue-tags-input": "^1.5.5",
    "@mapbox/mapbox-gl-draw": "^1.0.9",
    "@turf/bbox": "^6.0.1",
    "mapbox-gl": "^0.48.0",
    "mapbox-gl-vue": "^1.9.0",
    "moment": "^2.22.2",
    "node-sass": "^4.9.3",
    "rollup": "^0.65.0",
    "rollup-plugin-commonjs": "^9.1.6",
    "rollup-plugin-css-porter": "^0.1.2",
    "rollup-plugin-json": "^3.0.0",
    "rollup-plugin-node-resolve": "^3.3.0",
    "rollup-plugin-postcss": "^1.6.2",
    "rollup-plugin-replace": "^2.0.0",
    "rollup-plugin-vue": "^4.3.2",
    "spectre.css": "^0.5.3",
    "vue": "^2.5.17",
    "vue-multipane": "^0.9.5",
    "vue-slider-component": "^2.7.7",
    "vue-table-component": "1",
    "vue-template-compiler": "^2.5.17",
    "vue2-datepicker": "^2.4.2"
  },
  "scripts": {
    "build": "rollup --config=rollup.config.js",
    "start": "rollup --config=rollup.config.js --watch"
  },
  "devDependencies": {
    "rollup-plugin-livereload": "^0.6.0"
  }
}

And then in my application I use:

import MapboxDraw from '@mapbox/mapbox-gl-draw';

Edit: I can work around this issue by using the compiled version:

import MapboxDraw from '@mapbox/mapbox-gl-draw/dist/mapbox-gl-draw.js';

mapbox / mapbox-gl-draw

modes/index.js dynamic require breaks rollup #825