From cfffad8c6d749b11dadd079ec473d35692e2a010 Mon Sep 17 00:00:00 2001 From: Yangshun Tay Date: Mon, 10 Jun 2019 00:16:06 -0700 Subject: [PATCH] feat(v2): implement Google analytics plugin --- .../package.json | 16 +++++ .../src/analytics.js | 68 +++++++++++++++++++ .../src/index.js | 18 +++++ .../docusaurus-plugin-google-gtag/src/gtag.js | 5 +- .../src/index.js | 2 +- .../docusaurus-preset-classic/src/index.js | 5 +- .../docusaurus/src/server/plugins/index.ts | 38 +++++++---- website/docusaurus.config.js | 3 + 8 files changed, 138 insertions(+), 17 deletions(-) create mode 100644 packages/docusaurus-plugin-google-analytics/package.json create mode 100644 packages/docusaurus-plugin-google-analytics/src/analytics.js create mode 100644 packages/docusaurus-plugin-google-analytics/src/index.js diff --git a/packages/docusaurus-plugin-google-analytics/package.json b/packages/docusaurus-plugin-google-analytics/package.json new file mode 100644 index 0000000000..4e9d549666 --- /dev/null +++ b/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" + } +} diff --git a/packages/docusaurus-plugin-google-analytics/src/analytics.js b/packages/docusaurus-plugin-google-analytics/src/analytics.js new file mode 100644 index 0000000000..3f2d0ce8fb --- /dev/null +++ b/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'); + }, + }; +})(); diff --git a/packages/docusaurus-plugin-google-analytics/src/index.js b/packages/docusaurus-plugin-google-analytics/src/index.js new file mode 100644 index 0000000000..6a5cdaa2c1 --- /dev/null +++ b/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')]; + }, + }; +}; diff --git a/packages/docusaurus-plugin-google-gtag/src/gtag.js b/packages/docusaurus-plugin-google-gtag/src/gtag.js index 9ade3e8577..9ef10b8532 100644 --- a/packages/docusaurus-plugin-google-gtag/src/gtag.js +++ b/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, + }); }, }; })(); diff --git a/packages/docusaurus-plugin-google-gtag/src/index.js b/packages/docusaurus-plugin-google-gtag/src/index.js index 27405a7340..b6a79fee97 100644 --- a/packages/docusaurus-plugin-google-gtag/src/index.js +++ b/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')]; diff --git a/packages/docusaurus-preset-classic/src/index.js b/packages/docusaurus-preset-classic/src/index.js index f25682ffd6..1690e4bc30 100644 --- a/packages/docusaurus-preset-classic/src/index.js +++ b/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], ], }; diff --git a/packages/docusaurus/src/server/plugins/index.ts b/packages/docusaurus/src/server/plugins/index.ts index 8a1213d479..ff8215c0f8 100644 --- a/packages/docusaurus/src/server/plugins/index.ts +++ b/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[] = pluginConfigs.map(pluginItem => { - let pluginModuleImport; - let pluginOptions = {}; - if (typeof pluginItem === 'string') { - pluginModuleImport = pluginItem; - } else if (Array.isArray(pluginItem)) { - pluginModuleImport = pluginItem[0]; - pluginOptions = pluginItem[1] || {}; - } - // module is any valid module identifier - npm package or locally-resolved path. - const pluginModule = importFresh(pluginModuleImport); - return pluginModule(context, pluginOptions); - }); + const plugins: Plugin[] = _.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 diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js index cc1c6bab7b..e06f3d746a 100644 --- a/website/docusaurus.config.js +++ b/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',