Converting anchors to <router-links>

I have an SPA project that’s powered by a CMS via an API. One of the attributes returned is via a CMS which could contain anchor links <a> which link to other pages - but clicking these wont navigate via the SPA, they will trigger a full page load which defeats the purpose of the SPA. Currently i’m rendering this content with the v-html directive, but this won’t work if i simply replace the anchor tags with the component.

I’ve seen another issue on the forums that is the same as mine (Dynamically Compile <router-link />) but when i try the suggested solution I get hit with the following error:

You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.

I’m using nuxt.js as a framework for the SPA, so i’m not sure if i can do what it’s telling me to do. Anybody ever done this sort of thing?

There are some known issues with this at the moment:


https://nuxtjs.cmty.io/nuxt-community/google-adsense-module/issues/c8

Use:

build: {
    extend(config) {
        config.resolve.alias['vue'] = 'vue/dist/vue.common'
    }
}

I’m at this stage and am now working on a regex to convert the anchor tags into router-links including modifying the href attribute.