the error: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'get')
the main files
the axios file
import axios from "axios";
const token = "eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOJQ......";
export default axios.create({
baseURL: "https://api.themoviedb.org/3",
headers: {
authorization: `Bearer ${token}`,
},
});
the main.js file
import api from "@/data/db";
const app = createApp({});
app.config.globalProperties.$http = api;
the home file
async mounted() {
const response = await this.$http.get("/movie/550");
console.log(response);
},
Check out this sandbox. It logs a promise in the console, doesn't give the undefined error. Try putting your actual key in the db.js file and check if you can make a request to the API.
I think the problem in your code is with this line const app = createApp({});
You need to pass a component with the mounted() hook in it as an object param to the createApp function. Then you need to mount the app.
import api from "@/data/db";
import Home from "@/Home.vue";
const app = createApp(Home);
app.config.globalProperties.$http = api;
app.mount("#app"); // Provide a valid html id that exists in your index.html file