feat(v2): implement Google analytics plugin

packages/docusaurus-plugin-google-analytics/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "@docusaurus/plugin-google-analytics",
+  "version": "2.0.0-alpha.19",
+  "description": "Global analytics (analytics.js) plugin for Docusaurus",
+  "main": "src/index.js",
+  "publishConfig": {
+    "access": "public"
+  },
+  "license": "MIT",
+  "peerDependencies": {
+    "@docusaurus/core": "^2.0.0"
+  },
+  "engines": {
+    "node": ">=8"
+  }
+}

packages/docusaurus-plugin-google-analytics/src/analytics.js

@@ -0,0 +1,68 @@
+/**
+ * Copyright (c) 2017-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import siteConfig from '@generated/docusaurus.config';
+
+const {themeConfig} = siteConfig;
+
+export default (function() {
+  if (!themeConfig.googleAnalytics) {
+    return null;
+  }
+
+  const {trackingID} = themeConfig.googleAnalytics;
+  if (process.env.NODE_ENV === 'development' && !trackingID) {
+    console.warn(
+      'You specified the `googleAnalytics` object in `themeConfig` but the `trackingID` field was missing. ' +
+        'Please ensure this is not a mistake.',
+    );
+    return null;
+  }
+
+  if (
+    // process.env.NODE_ENV !== 'production' || // TODO: Add it back after testing that it works.
+    !trackingID ||
+    typeof window === 'undefined'
+  ) {
+    return null;
+  }
+
+  /* eslint-disable */
+  (function(i, s, o, g, r, a, m) {
+    i['GoogleAnalyticsObject'] = r;
+    (i[r] =
+      i[r] ||
+      function() {
+        (i[r].q = i[r].q || []).push(arguments);
+      }),
+      (i[r].l = 1 * new Date());
+    (a = s.createElement(o)), (m = s.getElementsByTagName(o)[0]);
+    a.async = 1;
+    a.src = g;
+    m.parentNode.insertBefore(a, m);
+  })(
+    window,
+    document,
+    'script',
+    'https://www.google-analytics.com/analytics.js',
+    'ga',
+  );
+  /* eslint-enable */
+
+  window.ga('create', trackingID, 'auto');
+  window.ga('send', 'pageview');
+
+  return {
+    onRouteUpdate({location}) {
+      // Set page so that subsequent hits on this page are attributed
+      // to this page. This is recommended for Single-page Applications.
+      window.ga('set', 'page', location.pathname);
+      // Always refer to the variable on window in-case it gets overridden elsewhere.
+      window.ga('send', 'pageview');
+    },
+  };
+})();

packages/docusaurus-plugin-google-analytics/src/index.js

@@ -0,0 +1,18 @@
+/**
+ * Copyright (c) 2017-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+const path = require('path');
+
+module.exports = function() {
+  return {
+    name: 'docusaurus-plugin-google-analytics',
+
+    getClientModules() {
+      return [path.resolve(__dirname, './analytics')];
+    },
+  };
+};

packages/docusaurus-plugin-google-gtag/src/gtag.js

@@ -48,7 +48,10 @@ export default (function() {
 
   return {
     onRouteUpdate({location}) {
-      gtag('event', 'page_view', {page_path: location.pathname});
+      // Always refer to the variable on window in-case it gets overridden elsewhere.
+      window.gtag('event', 'page_view', {
+        page_path: location.pathname,
+      });
     },
   };
 })();

packages/docusaurus-plugin-google-gtag/src/index.js

@@ -9,7 +9,7 @@ const path = require('path');
 
 module.exports = function() {
   return {
-    name: 'docusaurus-plugin-gtag',
+    name: 'docusaurus-plugin-google-gtag',
 
     getClientModules() {
       return [path.resolve(__dirname, './gtag')];

packages/docusaurus-preset-classic/src/index.js

@@ -8,7 +8,7 @@
 module.exports = function preset(context, opts = {}) {
   const {siteConfig = {}} = context;
   const {themeConfig} = siteConfig;
-  const {algolia} = themeConfig;
+  const {algolia, googleAnalytics, gtag} = themeConfig;
 
   return {
     themes: [
@@ -20,7 +20,8 @@ module.exports = function preset(context, opts = {}) {
       ['@docusaurus/plugin-content-docs', opts.docs],
       ['@docusaurus/plugin-content-blog', opts.blog],
       ['@docusaurus/plugin-content-pages', opts.pages],
-      ['@docusaurus/plugin-google-gtag', opts.gtag],
+      googleAnalytics && '@docusaurus/plugin-google-analytics',
+      gtag && '@docusaurus/plugin-google-gtag',
       ['@docusaurus/plugin-sitemap', opts.sitemap],
     ],
   };

packages/docusaurus/src/server/plugins/index.ts

@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+import _ from 'lodash';
 import {generate} from '@docusaurus/utils';
 import fs from 'fs-extra';
 import importFresh from 'import-fresh';
@@ -28,19 +29,30 @@ export async function loadPlugins({
   pluginsRouteConfigs: RouteConfig[];
 }> {
   // 1. Plugin Lifecycle - Initialization/Constructor
-  const plugins: Plugin<any>[] = pluginConfigs.map(pluginItem => {
+  const plugins: Plugin<any>[] = _.compact(
+    pluginConfigs.map(pluginItem => {
       let pluginModuleImport;
       let pluginOptions = {};
+      if (!pluginItem) {
+        return null;
+      }
+
       if (typeof pluginItem === 'string') {
         pluginModuleImport = pluginItem;
       } else if (Array.isArray(pluginItem)) {
         pluginModuleImport = pluginItem[0];
         pluginOptions = pluginItem[1] || {};
       }
+
+      if (!pluginModuleImport) {
+        return null;
+      }
+
       // module is any valid module identifier - npm package or locally-resolved path.
       const pluginModule = importFresh(pluginModuleImport);
       return pluginModule(context, pluginOptions);
-  });
+    }),
+  );
 
   // 2. Plugin lifecycle - loadContent
   // Currently plugins run lifecycle in parallel and are not order-dependent. We could change

website/docusaurus.config.js

@@ -36,6 +36,9 @@ module.exports = {
     gtag: {
       trackingID: 'UA-141789564-1',
     },
+    // googleAnalytics: {
+    //   trackingID: 'UA-141789564-1',
+    // },
     algolia: {
       apiKey: '47ecd3b21be71c5822571b9f59e52544',
       indexName: 'docusaurus-2',