microapps / gatsby-plugin-react-i18next

Easily translate your Gatsby website into multiple languages
MIT License
121 stars 72 forks source link

Cannot query field "allLocale" on type "Query". #118

Closed michaelrevans closed 2 years ago

michaelrevans commented 2 years ago

I've followed the How to use instructions here: https://www.gatsbyjs.com/plugins/gatsby-plugin-react-i18next/

and upon restarting my server with gatsby develop, I get the above error. Full error message here:

Cannot query field "allLocale" on type "Query".
ERROR #85923

There was an error in your GraphQL query:

Cannot query field "allLocale" on type "Query".

If you don't expect "allLocale" to exist on the type "Query" it is most likely a typo.
However, if you expect "allLocale" to exist there are a couple of solutions to common problems:

- If you added a new data source and/or changed something inside gatsby-node.js/gatsby-config.js, please try a restart of your development server
- The field might be accessible in another subfield, please try your query in GraphiQL and use the GraphiQL explorer to see which fields you can query and what shape they have
- You want to optionally use your field "allLocale" and right now it is not used anywhere. Therefore Gatsby can't infer the type and add it to the GraphQL schema. A quick fix is to add at least one entry with that field ("dummy content")

It is recommended to explicitly type your GraphQL schema if you want to use optional fields. This way you don't have to add the mentioned "dummy content". Visit our docs to learn how you can define the schema for "Query":
https://www.gatsbyjs.com/docs/reference/graphql-data-layer/schema-customization#creating-type-definitions

I'm no Gatsby veteran, so I'm guessing I have an issue with my setup that I'm just not seeing. Any help greatly appreciated. I realise I haven't given much detail about my project, so let me know what you need and I'll provide it.

Edit - 18/02/2022

Here is my current gatsby-config.js


const dotenv = require("dotenv");

dotenv.config({
  path: `.env.${process.env.NODE_ENV}`,
});

module.exports = {
  plugins: [
    `gatsby-plugin-image`,
    `gatsby-plugin-jss`,
    `gatsby-plugin-sharp`,
    `gatsby-plugin-react-helmet`,
    `gatsby-transformer-sharp`,
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        path: `${__dirname}/locales`,
        name: `locale`,
      },
    },
    {
      resolve: "gatsby-plugin-i18n",
      options: {
        langKeyDefault: "en",
        localeJsonSourceName: "locale",
        languages: ["en", "es", "de"],
        useLangKeyLayout: false,
        prefixDefault: true,
        i18nextOptions: {
          interpolation: {
            escapeValue: false,
          },
          keySeparator: false,
          nsSeparator: false,
        },
        pages: [
          {
            matchPath: "/:lang?/*",
            getLanguageFromPath: true,
          },
        ],
      },
    },
  ],
};
leduchung commented 2 years ago

There should be an issue in your gatsby-config.js. Can you post how did you config the plugin?

leduchung commented 2 years ago

@michaelrevans the name of the plugin should be resolve: "gatsby-plugin-react-i18next", because gatsby-plugin-i18n is another plugin. Otherwise, it looks good.

michaelrevans commented 2 years ago

Thanks @leduchung, this solved my issue.