Proxy a fake JS url to a real external JS file

[thely]

I'm completely at a loss, so hopefully you all can help. My org is switching from Google Analytics to Plausible. I don't know all the details, but Plausible ostensibly involves no user tracking (beyond just seeing that a webpage was visited). Regardless, most of the ad blockers still block the script they ask you to include. To counteract this, they include some suggestions for proxying to their script file. Something extremely basic, like this:

https://<yourdomain.com>/js/script.js -> https://plausible.io/js/plausible.js
https://<yourdomain.com>/api/event    -> https://plausible.io/api/event

For the life of me, I can't get this module to do something this simple. I have to assume it's my own lack of understanding. Here are the relevant parts of my nuxt.config.js:

head: {
  script: [
      {
        defer: true,
        "data-domain": "mydomain.com",
        src: process.env.BASE + "js/pls-script.js",
      },
    ],
},
proxy: {
  "/js/pls-script.js": {
      target: "https://plausible.io/js/plausible.js",
    },
}

The script portion is a Nuxt-formatted version of their script to include, which would normally look like:

<script defer data-domain="yourdomain.com" src="https://plausible.io/js/plausible.js"></script>

I just keep getting 404s from the proxied link. Any ideas or tips for debugging with this module are also welcome.

[danielroe]

@thely I assume you're not generating a static site but have a server up and running. If so, and you're getting this, it's possible it's because of render.fallback, which sends early 404 responses for missing assets rather than let it hit the Vue part of your app. You can disable it for .js like so:

export default {
  render: {
    fallback: {
      static: {
        // Avoid sending 404 for these extensions
        handlers: {
          '.js': false
        }
      }
    }
  }
}

See docs