Добавьте локальные файлы уценки в слой GraphQL в Gridsome - PullRequest
Новая
       13

Добавьте локальные файлы уценки в слой GraphQL в Gridsome

1 голос
/ 17 марта 2019

В Gridsome, как добавить локальные файлы разметки в слой GraphQL, чтобы вы могли добавить graphql для компонентов vue ?

На момент написания документа Gridsome для добавления данных из локальных файлов пустые.

1 Ответ

1 голос
/ 24 апреля 2019

Стартовый блог также имеет рабочую реализацию: https://github.com/gridsome/gridsome-starter-blog/blob/master/gridsome.config.js

У мрачного репо для source-filesystem есть несколько документов, которые помогут: https://github.com/gridsome/gridsome/tree/master/packages/source-filesystem

Документы, импортируемые сюда, на случай, если в будущем ссылка будет разорвана (но ссылка, вероятно, будет более актуальной).

@ gridsome / источник-файловая система

Преобразование файлов в контент, который можно получить с помощью GraphQL в ваших компонентах.

Установить

  • yarn add @gridsome/source-filesystem
  • npm install @gridsome/source-filesystem

Использование 

module.exports = {
  plugins: [
    {
      use: '@gridsome/source-filesystem',
      options: {
        path: 'blog/**/*.md',
        typeName: 'BlogPost',
        route: '/blog/:year/:month/:day/:slug'
      }
    }
  ]
}

Для источника файловой системы также потребуется преобразователь для анализа файлов. В приведенном выше примере выполняется поиск файлов Markdown , поэтому, чтобы Gridsome понимал содержимое файлов, необходимо установить @ gridsome / transformer-note как зависимость разработчика в вашем проекте. Gridsome автоматически преобразует файлы для вас, если в вашем package.json.

найден преобразователь, который поддерживает ваши файлы.

Опции

дорожка
  • Тип: string требуется

Где искать файлы. Должен быть глобус.

TYPENAME
  • Тип: string
  • По умолчанию: 'FileNode'

Тип GraphQL и имя шаблона. Файл .vue в src/templates должен соответствовать typeName, чтобы иметь шаблон для него.

маршрут
  • Тип: string

Определите динамический маршрут, если ваш источник может иметь определенную структуру имени пути. Это создаст единый маршрут для всех узлов из этого источника. Возможные параметры пути: year, month, day, slug или любое значение настраиваемого поля. Если опущен, маршрут для каждого файла будет создан на основе их пути и имени файла. Подробнее о параметрах маршрута .

рефов
  • Тип: object

Определите поля, которые будут иметь ссылку на другой узел. Ссылка typeName, как ожидается, будет существовать. Но тип контента также может быть создан автоматически, если вы установите create: true. Подробнее о ссылках . 

{
  refs: {
    // Reference to existing authors by id.
    author: 'Author',
    // Create a Tag content type and its nodes automatically.
    tags: {
      typeName: 'Tag',
      route: '/tag/:id',
      create: true
    }
  }
}
индекс
  • Тип: Array
  • По умолчанию: ['index']

Определите, какие файлы считать индексными файлами. Эти файлы не будут отображаться в своем пути к файлу и станут основным index.html файлом каталога. Убедитесь, что в каталоге имеется только один возможный индексный файл, если задано несколько имен индексов.

...