D
D
Dmitry Baskakov2020-11-18 05:22:52
Laravel
Dmitry Baskakov, 2020-11-18 05:22:52

How to make prerender-spa-plugin work with Laravel?

At the moment there is such code in webpack.mix.js:

spoiler

const mix = require('laravel-mix');

const path = require('path')
const PrerenderSPAPlugin = require('prerender-spa-plugin')

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

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

if (mix.inProduction()) {
    mix.version();
}

mix.webpackConfig = {
    plugins: [
        new PrerenderSPAPlugin({
            // Required - The path to the webpack-outputted app to prerender.
            staticDir: path.join(__dirname, 'dist'),
            // Required - Routes to render.
            routes: ['/', '/portfolio'],
        })
    ]
}


After running npm run prod, there are no errors, but the html files themselves are not created either. I also tried the structure below, but nothing has changed
mix.webpackConfig = {
resolve:{
    plugins: [
        new PrerenderSPAPlugin({


So the actual question is: how do I get Vue prerendering to work with Laravel? I need this only for the correct display of meta tags and, if possible, micro-markup.

I have extremely poor knowledge in pre-rendering and server rendering, so don't throw too many rags.

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Anton Anton, 2020-11-18
@Fragster

If laravel is used only as an API, and the application itself is a SPA, then it is more logical to split it into two applications - one is laravel (or even lumen) with an API, and the other is vue (vue-cli, nuxt and that's it). For mix, of course, is a good thing, but some settings are not made obviously + a lot of things are preconfigured in vue-cli and nuxt.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question