Laravel-mix: Support for VUE 3

[pflirae]

When it is planned to include VUE 3 support ??

[LaravelFreelancerNL]

With vuejs 3 hitting RC status this has become a very welcome improvement.

[ghost]

Agreed. Like like to hear a proposed timeline as well.

[Vac1911]

Update?

[mayanksdudakiya]

Any update, please?

[Masterbranch1]

Is there any update of VUE 3 support?

[rdarcy1]

Until support is added, you can use webpack directly:

// webpack.config.js

const path = require('path');
const { VueLoaderPlugin } = require('vue-loader');

module.exports = (env = {}) => ({
    mode: env.prod ? 'production' : 'development',
    devtool: env.prod ? 'source-map' : 'eval-cheap-module-source-map',
    entry: [
        path.resolve(__dirname, './resources/js/app.ts'),
    ],
    output: {
        path: path.resolve(__dirname, './public/js'),
        filename: "app.js"
    },
    resolve: {
        alias: {
            '@': path.resolve(__dirname, './resources/js'),
        },
        extensions: ['.ts', '.js', '.vue'],
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                use: 'vue-loader'
            },
            {
                test: /\.ts$/,
                loader: 'ts-loader',
                options: {
                    appendTsSuffixTo: [/\.vue$/],
                }
            },
        ]
    },
    plugins: [
        new VueLoaderPlugin(),
    ],
});

Minimal Laravel config based on https://github.com/vuejs/vue-next-webpack-preview
Note this isn't transpiling for backwards compatibility.

Run with webpack or npx webpack

[KABBOUCHI]

@mayanksdudakiya and @Masterbranch1 you can use temporary this package https://github.com/KABBOUCHI/laravel-mix-vue3 until the official support is out.

[rrrrando]

This solution also works for me:

https://stackoverflow.com/questions/63967346/install-vue-3-0-in-laravel/63994238#63994238

If you use inline template like i do then you have to switch to using slots since inline-template is deprecated.

[JeffreyWay]

Support is in Mix v6.