Browserify and @google/earthengine: Package JavaScript modular geospatial data access and analysis into browser-usable files

Question

I'm trying to use Browserify to import Google Earth Engine's Javascript API.

I have installed this module:

npm install --save-dev @google/earthengine

I created a new main.js file for testing purposes:

var md = require('@google/earthengine');
 
module.exports = MDOutSystems;

function MDOutSystems() {
  this.mdInstance = md;
};

MDOutSystems.prototype.data.authenticateViaPrivateKey = function(
    privateKey, opt_success, opt_error, opt_extraScopes,
    opt_suppressDefaultScopes) {
    md.data.authenticateViaPrivateKey(privateKey, opt_success, opt_error, opt_extraScopes,
        opt_suppressDefaultScopes);
};

MDOutSystems.prototype.initialize = function() {
    md.initialize();
};

MDOutSystems.prototype.Image = function(source) {
    md.Image(source);
};

MDOutSystems.prototype.getInstance = function () {
    return this.mdInstance;
}

(I received a warning that I need to create a d.ts file with declare module '@google/earthengine')

I use the following code to expose the module I created:

Browserify main.js --standalone MDOutSystems > google-earth-outsystems.js

However, when I try to call

var ee = new MDOutSystems();

I get an error saying "MDOutSystems is not defined".

Help.

I tried moving main.js into the /node_modules folder and running the browserify command again. This actually resulted in a completely different google-earth-outsystems.js file, but it still didn't work.

Answer 1

I guess the browser will compress the code and change the function name.

MDOutSystems() will not be recognized after that.

Attach your methods to the window object.

like this:

function MDOutSystems() {
  this.mdInstance = md;
};

window.MDOutSystems = MDOutSystems;