[Vuejs]-How can I use different resources for different Vue layouts?

by

1👍

✅

If you’re looking for separate Vue instances for both, then you can follow this

Create separate blade templates for both the instances. Add separate routes for both templates.

Route::get('/dashboard/{any?}', function () {
    return view('dashboard');
})->where('any', '[\/\w\.-]*');

Route::get('/{any?}', function () {
    return view('index');
})->where('any', '[\/\w\.-]*');

Create two Vue instances in separate js files, say app.js and dashboard.js. You can create this in another directory like dashboard/dashboard.js

Update your webpack.mix.js

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css');

mix.js('resources/dashboard/dashboard.js', 'public/js')
    .sass('resources/sass/dashboard.scss', 'public/css');

You can link the build files in public to the corresponding blade templates.

👤Rijosh

Leave a comment