I am experiencing an issue where axios is not following my GET path when the project is built, although it works fine in dev mode.
I am using this code to fetch local .html files and inject them into my vue component.
<template>
<div>
<div v-html="message"></div>
</div>
</template>
<script>
import axios from 'axios';
export default {
data () {
return {
message: '',
}
},
async mounted(){
const mypath = 'http://***.com/posts/' + this.$route.params.post + '.html';
const ip = await this.$axios.$get(mypath);
this.message = ip;
}
}
</script>
This particular .vue file can be found at "pages/blogs/posts/_post.vue"
The .html files are located in "static/posts/examplepost.html"
When running in dev mode, if I change the first part of the path to either "http://localhost:3000/posts/" or just "/posts/", everything works as expected.
However, after publishing the project and navigating to a blog post URL, I encounter a 404 error at the following path:
"https://***.com/blogs/posts/examplepost.html"Why does it work in dev mode but not after being built?
I have tried relocating the posts to the "/blogs/posts/" directory and have also attempted creating a new instance of axios with the baseURL set directly in my component, but I continue to face the same issues.