Last active
March 14, 2022 21:32
-
-
Save ismyrnow/6252718 to your computer and use it in GitHub Desktop.
Google Analytics AMD Module
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
define(function (require) { | |
var module; | |
// Setup temporary Google Analytics objects. | |
window.GoogleAnalyticsObject = "ga"; | |
window.ga = function () { (window.ga.q = window.ga.q || []).push(arguments); }; | |
window.ga.l = 1 * new Date(); | |
// Immediately add a pageview event to the queue. | |
window.ga("create", "{{TrackingID}}", "{{Domain}}"); | |
window.ga("send", "pageview"); | |
// Create a function that wraps `window.ga`. | |
// This allows dependant modules to use `window.ga` without knowingly | |
// programming against a global object. | |
module = function () { window.ga.apply(this, arguments); }; | |
// Asynchronously load Google Analytics, letting it take over our `window.ga` | |
// object after it loads. This allows us to add events to `window.ga` even | |
// before the library has fully loaded. | |
require(["//www.google-analytics.com/analytics.js"]); | |
return module; | |
}); |
Thanks @saxicek for that change. I've updated the gist.
For anyone wondering, I'm using this in production with RequireJS and the R.js optimizer, and it works great.
I would recommend the Google's option for changing the global name of the analytics object.
Just add another variable gaName
and replace all window.ga
instances with window[gaName]
define(function (require) {
var module,
gaName = "ga"; // Global name of analytics object. Defaults to `ga`.
// Setup temporary Google Analytics objects.
window.GoogleAnalyticsObject = gaName;
window[gaName] = function () { (window[gaName].q = window[gaName].q || []).push(arguments); };
window[gaName].l = 1 * new Date();
// Immediately add a pageview event to the queue.
window[gaName]("create", "{{TrackingID}}", "{{Domain}}");
window[gaName]("send", "pageview");
// Create a function that wraps `window[gaName]`.
// This allows dependant modules to use `window[gaName]` without knowingly
// programming against a global object.
module = function () { window[gaName].apply(this, arguments); };
// Asynchronously load Google Analytics, letting it take over our `window[gaName]`
// object after it loads. This allows us to add events to `window[gaName]` even
// before the library has fully loaded.
require(["//www.google-analytics.com/analytics.js"]);
return module;
});
If I add this to my RJS project, how exactly do I use it?
@paulcanning. You can just just add the module to your require / define method. It will take care of rest of things.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
You should use
require(["//www.google-analytics.com/analytics.js"]
instead ofrequire(["http://www.google-analytics.com/analytics.js"]
.