Rollup: (define|require|module) is not defined

Viewed 2319

I'm trying to use Rollup with Gulp

The following is my Gulpfile:

const gulp = require("gulp");
const rollup = require("rollup-stream");
const vue = require("rollup-plugin-vue");
const resolve = require("rollup-plugin-node-resolve");
const commonjs = require("rollup-plugin-commonjs");
const json = require("rollup-plugin-json");
const babel = require("rollup-plugin-babel");
const globals = require("rollup-plugin-node-globals");
const source = require("vinyl-source-stream");
const buffer = require("vinyl-buffer");
const uglify = require("gulp-uglify");

// ... CSS tasks and the like

gulp.task("js", function scriptTask()
{
    rollup({
        input: "js/app.js",
        plugins: [
            vue(),
            resolve({
                jsnext: true,
                browser: true
            }),
            json(),
            commonjs(),
            babel({
                exclude: ["node_modules/**"],
                presets: [["env", {modules: false}]],
                plugins: ["external-helpers"]
            }),
            globals()
        ],
        format: "iife",
    })
        .pipe(source("bundle.js"))
        .pipe(buffer())
        .pipe(uglify())
        .pipe(gulp.dest("../dist"));
});

// ... default tasks and the like

This seems to successfully pull all dependencies and performs tree shaking, but then the output file doesn't run. Depending on the value of the "format" option passed to Rollup, I get one of the following errors when trying:

Uncaught ReferenceError: require is not defined
    at bundle.js:1
    at bundle.js:1
    at bundle.js:1

Uncaught ReferenceError: define is not defined
    at bundle.js:1
    at bundle.js:1
    at bundle.js:1

Uncaught ReferenceError: module is not defined
    at bundle.js:1
    at bundle.js:1
    at bundle.js:1

Nothing works!

1 Answers

You should attach this to the end of your script.

gulp.task('default', ['js']);
gulp.task('build', ['js']);
Related