Laravel Mix IE11 Babel Issues

I'm currently trying to install Laravel Mix inside a WordPress project to handle my asset compilation.

I have my webpack.mix.js file set up as follows:

let mix = require("laravel-mix");

mix.babel("src/js/app.js", "dist/js/app.js")
    .sass("src/scss/style.scss", "dist/css/style.css")
    .sourceMaps()
    .setPublicPath("dist");

I also have a .babelrc set up as follows:

{
    "presets": [
        [
            "@babel/preset-env",
            {
                "targets": {
                    "ie": "11"
                }
            }
        ]
    ]
}

The only code I'm currently using inside app.js is this:

import Vue from "vue";

However, when I go to the page I get the following error:

Uncaught ReferenceError: require is not defined at app.js:3

And file compiled looks like this (the issue apparently lies on the var _vue line):

"use strict";

var _vue = _interopRequireDefault(require("vue"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

I'm really stuck on this issue as I'm unsure what to do. Any ideas appreciated!