CODEWITHSUNDEEP
webpacksingle-page-applicationmodernizrvue-cli-3prerender
Alvise X
Alvise X

Reputation: 21

Vue - Prevent prerender-spa-plugin from loading modernizr script

I am building a production website with Vue-cli 3 + prerender-spa-plugin, but I need some scripts (such as modernizr detections) that can only be loaded by the end user, not the pre-spa-plugin environment.

How can I configure the settings to make the prerender-spa-plugin ignore these scripts?

I have the script in the index file, on the public folder like this:

<html>
  <head>
    <!-- Global site tag (gtag.js) - Google Analytics -->
    <!-- Facebook Pixel Code -->
  </head>
  <body>
    <div id="app"></div>
    <!-- jivochat script -->

    <script src="modernizr-webp.js"></script>

  </body>
</html>

Upvotes: 1

Views: 596

Answers (1)

Alvise X
Alvise X

Reputation: 21

Searching in the issues of the plugin I found one solution:

In the vue.config.js :

new PrerenderSPAPlugin({
  ....
  renderer:  new PrerenderSPAPlugin.PuppeteerRenderer({
     // The name of the property
      injectProperty: '__PRERENDER_INJECTED',
     // The values to have access to via `window.injectProperty` (the above property )
      inject: { foo:  'bar' }
    })
})

and in app code:


if ( window.__PRERENDER_INJECTED === undefined ) {
       // The code snippet to be ignored in pre-render
}

Upvotes: 1

Related Questions