Hi, I’m new to datoCms and I checked the documentations for connecting the graphql to my Vue cli project but when I open the website on my local host I get this error and I don’t know how to solve it ?
vue.runtime.esm.js?c320:4573 [Vue warn]: Error in mounted hook (Promise/async): "[{"message":"Parse error on \"course\" (IDENTIFIER) at [2, 9]","locations":[{"line":2,"column":9}]}]"
this is my api and my code
import axios from 'axios'
export async function request({ query, variables, preview }) {
const endpoint = preview
? `https://graphql.datocms.com/preview`
: `https://graphql.datocms.com/`
const { data } = await axios.post(
endpoint,
{
query,
variables
},
{
headers: {
Authorization:
`Bearer ${process.env.VUE_APP_CMS_DATOCMS_API_TOKEN}`
}
}
)
if (data.errors) {
throw JSON.stringify(data.errors);
}
return data.data;
}
<template>
<div>
<div>{{ data }}</div>
</div>
</template>
<script>
import { request } from "./datocms";
export default {
name: "App",
data() {
return {
data: null
};
},
async mounted() {
this.data = await request({
query: `
course {
id
name
courseHeader {
... on CourseHeaderRecord {
smallTitle
bigTitle
buttonText
description
}
}
}
`
});
}
};
</script>
