Cara mendapatkan HTML halaman Gatsby di graphQL

Question

Saya mencoba menerapkan penelusuran situs dengan elasticlunr dan saya mengikuti petunjuk untuk gatsby-plugin-elasticlunr-search. Saya terjebak saat mencoba membuat indeks pencarian karena saya tidak dapat menemukan kueri graphql yang menyertakan konten saya.

Setiap contoh yang saya temukan menunjukkan cara mengedit gatsby-config.js untuk mengisi graphql dengan konten penurunan harga:

resolvers: {
      // For any node of type MarkdownRemark, list how to resolve the fields` values
      MarkdownRemark: {
        title: node => node.frontmatter.title,
        tags: node => node.frontmatter.tags,
        path: node => node.frontmatter.path,
      },
    },

Saya tidak mengalami penurunan harga, konten saya sepenuhnya dalam HTML dan beberapa file JSON. Apakah ada cara untuk menarik konten HTML ke graphql sehingga dapat dimasukkan dalam indeks pencarian?

Apakah saya melakukan ini dengan cara yang salah?

Answer 1

Anda dapat mengambil file / konten JSON dengan cara yang sama seperti panduan yang dilakukan dengan penurunan harga (seperti yang Anda lihat di dokumen Gatsby atau di artikel ini ), namun, Anda mungkin perlu membuat struktur data untuk mengisi HTML Anda karena Anda bisa ' t mengambil langsung data dari file HTML seperti itu, karena tidak berada di dalam sistem file Gatsby, sehingga Gatsby tidak tahu cara membuat node atau skema GraphQL dari konten itu.

Pendekatan termudah adalah dengan membuat sistem file data khusus (JSON, YAML, atau file penurunan harga) untuk mengisi HTML Anda dan membuatnya dinamis, bukan "hardcode" seperti yang sebenarnya (tampaknya). Setelah Anda menyetel sistem file dan Anda dapat membuat kueri untuk mengumpulkan data dan mengisi halaman / komponen Anda, Anda akan dapat membuat kueri untuk digunakan elasticlunr.

Sumber:

• https://itnext.io/reading-data-from-a-json-file-with-gatsby-graphql-572b18ab98a
• https://github.com/gatsbyjs/gatsby/issues/20734
• GraphQL Query mengakses semua file json yang diubah dalam folder yang terletak di subdirektori