Laravel-mix: mix.babel() / mix.extract() not working as expected

[dduupp]

• Laravel Mix v2.0.0
• Node v9.4.0
• NPM v5.6.0
• Yarn v1.3.2
• OS: macOS High Sierra

Firstly, I should mention that the documentation for mix.babel() is lacking.
This is what I could find out from https://laravel.com/docs/5.6/mix#vanilla-js:

A slight variation of mix.scripts() is mix.babel(). Its method signature is identical to scripts; however, the concatenated file will receive Babel compilation, which translates any ES2015 code to vanilla JavaScript that all browsers will understand.

So I'm trying to use mix in my Laravel project to compile an app using jQuery, ParsleyJS and Vue.
Here's the relevant code in my webpack.mix.config:

mix.babel([
        ...
    ], 'public/frontend/js/app.js');
    .extract(['jquery', 'parsleyjs', 'vue'], 'public/frontend/js/vendor.js');

My template loads the scripts in the correct order:

<script src="{{ asset('js/manifest.js') }}"></script>
<script src="{{ asset('frontend/js/vendor.js') }}"></script>
<script src="{{ asset('frontend/js/app.js') }}"></script>

If I compile and navigate to my page, both window.$ and window.Parsley exist, however window.Vue is undefined. Shouldn't mix.extract() take care of this?

In an attempt to get Vue in the window object, I've tried creating a bootstrap.js file like this:

import Vue from 'vue';

window.Vue = Vue;

And including it in mix like this:

mix.babel([
        'resources/assets/frontend/js/bootstrap.js'
        ...
    ], 'public/frontend/js/app.js');
    .extract(['jquery', 'parsleyjs', 'vue'], 'public/frontend/js/vendor.js');

Which gets compiled to require('vue') in public/frontend/js/app.js, which in turn gives a console error: ReferenceError: require is not defined.

Then I've tried changing bootstrap.js to:

window.Vue = require('vue');

Which gives the exact same result.

Am I missing something here?

[ankurk91]

mix.babel() does not take care of your module imports.
mix.extract() does not make modules available in global scope. Use mix.autoload() for that.
You should watch webpack for every one series on laracasts.