Google Analytics Error - GraphQLError: Cannot query field "allMarkdownRemark" on type "Query".

[iColdPlayer]

Hi,
I'm currently using your theme to build my personal blog.
But somehow I need to add Google Analytics into my blog, but, it gives me an error :
GraphQLError: Cannot query field "allMarkdownRemark" on type "Query".. Could you please provide me about what's wrong with it?

Here's the error log when trying to deploy on netlify :

9:40:14 PM: success source and transform nodes — 0.026 s
9:40:14 PM: success building schema — 0.196 s
9:40:14 PM: error gatsby-node.js returned an error
9:40:14 PM: 
9:40:14 PM:   GraphQLError: Cannot query field "allMarkdownRemark" on type "Query".
9:40:14 PM:   
9:40:14 PM:   - debuggability.js:313 Promise._execute
9:40:14 PM:     [repo]/[bluebird]/js/release/debuggability.js:313:9
9:40:14 PM:   
9:40:14 PM:   - promise.js:483 Promise._resolveFromExecutor
9:40:14 PM:     [repo]/[bluebird]/js/release/promise.js:483:18
9:40:14 PM:   
9:40:14 PM:   - promise.js:79 new Promise
9:40:14 PM:     [repo]/[bluebird]/js/release/promise.js:79:10
9:40:14 PM:   
9:40:14 PM:   - index.js:372 graphqlRunner
9:40:14 PM:     [repo]/[gatsby]/dist/bootstrap/index.js:372:14
9:40:14 PM:   
9:40:14 PM:   - gatsby-node.js:11 Object.exports.createPages
9:40:14 PM:     /opt/build/repo/gatsby-node.js:11:10
9:40:14 PM:   
9:40:14 PM:   - api-runner-node.js:154 runAPI
9:40:14 PM:     [repo]/[gatsby]/dist/utils/api-runner-node.js:154:37
9:40:14 PM:   
9:40:14 PM:   - api-runner-node.js:258 resolve
9:40:14 PM:     [repo]/[gatsby]/dist/utils/api-runner-node.js:258:19
9:40:14 PM:   
9:40:14 PM: 
9:40:14 PM: Caching artifacts
9:40:14 PM: Started saving node modules
9:40:14 PM: Started saving emacs cask dependencies
9:40:14 PM: Finished saving emacs cask dependencies
9:40:14 PM: Shutting down logging, 9 messages pending

I was trying to figure it out referring to this issue #2212 & this #2150 but still, it doesn't work in my case...

As you can see here at my gatsby-config.js :

const config = require('./config');
const plugins = require('./gatsby-config.plugins');

module.exports = {
  pathPrefix: config.pathPrefix,
  siteMetadata: {
    // Data used by some gatsby plugins
    siteUrl: config.siteUrl,
    title: config.siteTitle,
    description: config.siteDescription
  },


  plugins:   [
    {
      resolve: 'gatsby-plugin-google-analytics',
      options: {
      // replace "UA-XXXXXXXXX-X" with your own Tracking ID
        trackingId: "UA-965XXXX23-3",
        head: true,
    },
      resolve: 'gatsby-plugin-facebook-analytics',
      options: {
        appId: "25617665XXXXX",
        // Include facebook analytics in development.
        // Defaults to false meaning the library will only be loaded in production.
        includeInDevelopment: false,
        // Include debug version of sdk
        // Defaults to false meaning the library will load sdk.js
        debug: false,
        head: true,
        // Can select your language, default will load english
        language: "en_US",
      },
  },]
}

[luigi-colella]

Hi and thanks for trying out my starter!
It seems that you've forgotten some brackets within plugins array. Replace it with this:

plugins:  [
    {
      resolve: 'gatsby-plugin-google-analytics',
      options: {
      // replace "UA-XXXXXXXXX-X" with your own Tracking ID
        trackingId: "UA-965XXXX23-3",
        head: true
      }
    },
    {
      resolve: 'gatsby-plugin-facebook-analytics',
      options: {
        appId: "25617665XXXXX",
        // Include facebook analytics in development.
        // Defaults to false meaning the library will only be loaded in production.
        includeInDevelopment: false,
        // Include debug version of sdk
        // Defaults to false meaning the library will load sdk.js
        debug: false,
        head: true,
        // Can select your language, default will load english
        language: "en_US"
      }
    }
]

[iColdPlayer]

Thank's for ur suggestion, I'm totally new with it.

But I've tried it out and still getting the same error.
I think that causes the error is from "query" in the gatsby-node.js file, as you can see above.

When I trying to deploy it to netlify. but I'm not sure why this error is showing up only when I added the plugins in gatsby-config.js file.

Also, I've tried adding this config to my gatsby-config.js without installing the plugin.
The deployment becomes successfully, but it won't trigger the analytics.

What if I insert the Analytics into header.js?
is that possible?

Somehow I think to add the analytics into it refer to their support : Adding analytics.js to Your Site

And followed this issue from StackOverflow

On my header.js looks like :

/**inserting Google Analytics on header.js 

function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
      window.onload = func;
  } else {
      window.onload = function() {
          oldonload();
          func();
      }
  }
}

var _gaq = _gaq || [];

function loadtracking() {
        window._gaq.push(['_setAccount', 'UA-96XXXXX-3']);
        window._gaq.push(['_trackPageview']);

        (function() {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
        })();
}

The deployment becomes successfully. But still, it won't trigger the analytics...

[luigi-colella]

Before to go in deep in the issue:

• Does the error happen also when you build your project locally or only when you deploy on Netifly?
• Does the error happen only with gatsby-plugin-google-analytics plugin or also with gatsby-plugin-facebook-analytics?
• From your first snippet

As you can see here at my gatsby-config.js :

const config = require('./config');
const plugins = require('./gatsby-config.plugins');

module.exports = {
  pathPrefix: config.pathPrefix,
  siteMetadata: {
    // Data used by some gatsby plugins
    siteUrl: config.siteUrl,
    title: config.siteTitle,
    description: config.siteDescription
  },


  plugins:   [
    {
      resolve: 'gatsby-plugin-google-analytics',
      options: {
      // replace "UA-XXXXXXXXX-X" with your own Tracking ID
        trackingId: "UA-965XXXX23-3",
        head: true,
    },
      resolve: 'gatsby-plugin-facebook-analytics',
      options: {
        appId: "25617665XXXXX",
        // Include facebook analytics in development.
        // Defaults to false meaning the library will only be loaded in production.
        includeInDevelopment: false,
        // Include debug version of sdk
        // Defaults to false meaning the library will load sdk.js
        debug: false,
        head: true,
        // Can select your language, default will load english
        language: "en_US",
      },
  },]
}

I note that you've imported const plugins = require('./gatsby-config.plugins'); but you didn't use it in the plugins array. If you don't import gatsby-source-filesystem and gatsby-transformer-remark plugins, no MarkdownRemark node will be created and the GraphQL query will fail as above.

• Is gatsby-source-filesystem plugin properly configured? Does it point to a folder with .md files?
• If you want add analytics.js directly in your website, you should place it in gatsby-browser.js. If you place it in any other files as header.js, it will not be evaluated in the browser but in Gatsby's build script. Another way to run JS code directly in the browser at runtime is using the React's lifecycle events or synthetic events (but imho you should not use them for this case for a matter of design).

[luigi-colella]

Free to reopen the issue if you have new informations about it.