Hillcow
Hillcow

Reputation: 969

Laravel-Mix: Vue not available in app.js and bootstrap.js after Laravel-Mix upgrade to v6

So I just upgraded from Laravel-Mix v1 to v6.

For example, in app.js I do the following to register all Vue components:

const files = require.context('./', true, /\.vue$/i)
files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key)))

But I get this error:

app.js:17638 Uncaught ReferenceError: Vue is not defined

I read about it and added these lines in webpack.mix.js:

resolve: {
    alias: {
        vue: 'vue/dist/vue.js'
    }
}

but unfortunately that doesn't do anything. Same error still.

When I add import Vue from 'vue/dist/vue.js' on top of app.js and bootstrap.js I don't get these error no longer, but the code for registering vue components is not working.

Bootstrap.js: https://www.codepile.net/pile/8rX4Qlrm package.json: https://www.codepile.net/pile/JBA4NYLk

Does anyone have an idea what's going on here? Thanks!

Upvotes: 0

Views: 572

Answers (1)

Hillcow
Hillcow

Reputation: 969

Change the line

window.Vue = require("Vue");

to

import Vue from "Vue";

Upvotes: 1

Related Questions