Vue CLI 3 prerender-spa-plugin

Question

I've tried to prerender the routes of my SPA with the npm package prerender-spa-plugin with Vue CLI 3, and I get a decent output as seen here after running "npm run build":

The output in the index.html is an error:

<html>

<head>
</head>

<body>Html Webpack Plugin:
  <pre>  ReferenceError: BASE_URL is not defined
  
  - index.html:96 
    C:/Users/Fred/v2/public/index.html:96:11
  
  - index.html:99 0971.module.exports
    C:/Users/Fred/v2/public/index.html:99:3
  
  - index.js:284 Promise.resolve.then
    [v2]/[html-webpack-plugin]/index.js:284:18
  
  </pre>
</body>

</html>

My vue.config.js is this:

const path = require('path');
const PrerenderSPAPlugin = require('prerender-spa-plugin');
var HtmlWebpackPlugin = require('html-webpack-plugin');


module.exports = {
    configureWebpack: {
        plugins: [
            new HtmlWebpackPlugin({
                template: './public/index.html',
                inject: false
            }),
            new PrerenderSPAPlugin({
                staticDir: path.join(__dirname, './dist'),
                routes: ['/', '/om-guldbaek', '/om/:id', '/aktiviteter', '/aktivitet/:id', '/foreninger', '/forening/:id', '/begivenheder', '/begivenhed/:id', '/gdpr', '/institutioner', '/institution/:id', '/login', '/nyheder', '/nyhed/:id', '/kontakt', '/registreringer'],
            })
        ],
    },
};

When I run "npm run build" in VSCode, it keeps returning "Building for production..." without anything happening. Anyone know about this issue?

Fred Fred · Accepted Answer · 2019-01-18T08:41:49

Alright I found the issue. In the index.html I had the line:

<link rel="icon" href="<%= BASE_URL %>favicon.ico">

So now it's fixed

Vue CLI 3 prerender-spa-plugin

1 Answers