Доступ к запрошенным данным из компонента Vue с помощью Gridsome

Я новичок в Gridsome, а также в GraphQL. Однако я не использую GraphQL для этого проекта. У меня просто есть настройка проекта Gridsome и некоторые данные JSON, и я пытаюсь определить его глобально, чтобы иметь доступ к нему со всех моих страниц и компонентов Vue. (Я знаю, что его можно импортировать в компонент, но я ищу более «сетчатый способ» сделать это). Я сделал следующие шаги для достижения этого:

1) Создал папку для файла Json: data/myJson.json. Json-файл:

{
    "startPage": {
        "title": "Welcher Typ bist Du?",
        "subtitle": "Los geht's beim lustigen Datev-Quiz!",
        "startButton": "Quiz starten"
    }
}

2) Мой gridsome.server.js выглядит так:

var myJson = require('./data/questions.json');
module.exports = function (api) {
  api.loadSource(store => {
    const startPage = store.addContentType({
      typeName: 'StartPage'
    });

    startPage.addNode({
      title: 'StartPageInfo',
      fields: {
        title: myJson.startPage.title,
        subtitle: myJson.startPage.subtitle,
        startButton: myJson.startPage.startButton
      }
    })
  })
}

3) И я запрашиваю эти данные на странице index.vue.

Я могу получить доступ к этим данным в своем шаблоне. Итак, если я сделаю что-то вроде этого

<h4 v-html = "$page.allStartPage.edges[0].node.fields"></h4>

то работает отлично.

Моя проблема, однако, в том, что я не могу получить доступ к этим запрошенным данным в объекте Vue data или в методах и так далее. Что-то вроде этого:

data() {
  retrun {
    START_PAGE_END_POINT: this.$page.allStartPage.edges[0].node.fields
  }
}

выдает мне сообщение об ошибке и говорит, что $page не определен.

Любые мысли, что я делаю неправильно?

🤔 А знаете ли вы, что...
Vue.js обеспечивает легкую интеграцию с существующими проектами и библиотеками.