Errors on grunt build using google-api-nodejs-client with webpack

[dmk12]

I'm using https://www.npmjs.com/package/googleapis in a ReactJS Webpack app. npm install googleapis --save installed it ok, added "googleapis": "^2.0.2" to my package.json, but when I run grunt build I get the following warnings (followed by lots of errors which I'll post upon request, as it is a lot of text):

WARNING in ./~/googleapis/apis/index.js
Critical dependencies:
41:23-44 the request of a dependency is an expression
@ ./~/googleapis/apis/index.js 41:23-44

WARNING in ./~/googleapis/~/request/~/hawk/~/hoek/lib/index.js
Critical dependencies:
403:34-60 the request of a dependency is an expression
@ ./~/googleapis/~/request/~/hawk/~/hoek/lib/index.js 403:34-60

Code that requires googleapis in my React component:

var gapi = require('googleapis');

Note: Any other code from the component can be provided on request, but I don't believe it's relevant to this issue.

My package.json dependencies:

"dependencies": {
"aws-sdk": "^2.0.21",
"chalk": "^0.5.0",
"crypto-js": "^3.1.2-5",
"cryptojs": "^2.5.3",
"envify": "^1.2.1",
"fluxxor": "1.5.1",
"googleapis": "^2.0.2",
"imports-loader": "^0.6.3",
"jquery": "~2.1.1",
"moment": "^2.8.3",
"react": "0.11.1",
"react-bootstrap": "0.12.0",
"react-router": "0.5.2",
"react-router-bootstrap": "0.5.0"
},
"devDependencies": {
"connect-livereload": "^0.4.0",
"css-loader": "^0.7.0",
"es6-promise": "^1.0.0",
"esrever": "^0.1.0",
"grunt": "^0.4.5",
"grunt-contrib-copy": "^0.5.0",
"grunt-contrib-less": "~0.11.4",
"grunt-contrib-uglify": "^0.7.0",
"grunt-contrib-watch": "^0.6.1",
"grunt-git": "^0.2.14",
"grunt-gitinfo": "^0.1.6",
"grunt-karma": "^0.8.3",
"grunt-lesslint": "^1.1.13",
"grunt-rsync": "^0.6.1",
"grunt-ssh": "^0.11.2",
"grunt-webpack": "^1.0.8",
"jssha": "^1.5.0",
"jsx-loader": "^0.10.2",
"karma": "^0.12.17",
"karma-chrome-launcher": "^0.1.7",
"karma-coverage": "^0.2.7",
"karma-jasmine": "^0.1.5",
"karma-js-coverage": "^0.4.0",
"karma-osx-reporter": "^0.1.0",
"karma-phantomjs-launcher": "^0.1.4",
"karma-sourcemap-loader": "^0.3.2",
"karma-webpack": "^1.2.1",
"load-grunt-tasks": "^0.6.0",
"style-loader": "^0.6.4",
"time-grunt": "^1.0.0",
"webpack": "^1.4.15"
}

npm version 2.5.1

node version v0.12.1

Thanks in advance for any help!

[robertrossmann]

The offending line is:

var Endpoint = require(endpointPath);

I think it complains about not stating our dependency explicitly (as a string), but rather as a variable that needs to be evaluated first (an expression).

From architectural perspective, this is beneficial to keep the codebase flexible and will likely not be modified to avoid the warning you are getting. I think you will need to figure a way how to make your Grunt task ignore this warning or otherwise make it work...

[dmk12]

Thanks @Alaneor. One of the errors I'm getting, any thoughts on that? It seems to be missing the fs module, which seems to be a native nodeJS module and should be available.

ERROR in ./~/googleapis/~/request/~/hawk/~/hoek/lib/index.js
Module not found: Error: Cannot resolve module 'fs' in /Users/dev/wwb-web-app/node_modules/googleapis/node_modules/request/node_modules/hawk/node_modules/hoek/lib
 @ ./~/googleapis/~/request/~/hawk/~/hoek/lib/index.js 3:9-22

[robertrossmann]

Can't tell without knowing what Grunt plugin is causing it... But I have a terrible suspicion it's Browserify.

I cannot imagine how you could possibly package the fs module for browser.

[FriesFlorian]

@dmk12 Any chance you found a solution?

[dmk12]

@FriesFlorian No, sorry. I attributed it to the fact that the npm script is alpha, so things just don't work... :/ Ended up adding a link to googleapi to my index.html the old fashioned way.

[tdeheurles]

hi,
It seems that this error is still present.
Does someone found a workaround in order to googleapi working with node ?

I'd like to implement some test but I block on that issue for now ...

I'm not exactly in the same case as I'm using babel.

[john-osullivan]

My team and I are using webpack (which is also using babel) as part of a combined setup of React+Meteor, and are also getting this error. Kind of a bummer, this is the only package which is throwing this sort of error on us. We're getting both the the request of a dependency is an expression error and the Cannot resolve module 'fs' one. This is the read-out of errors:

Other "missing" modules include net and tls. Interestingly, those modules are missing in a number of other dependencies which aren't the google-api-nodejs-client library. The errors disappear when I don't have google = request('googleapis') in my files, though.

@dmk12 , did loading googleapi from a script tag ever cause any issues? Are you able to perform any operations from the server using the APIs? We want our server-side code to interact with them, but this error is stopping us dead in our tracks.

EDIT: @Alaneor , is this error likely to stay in? Many node.js users use webpack, we can't be the only ones running into this. Our specific use-case is running server-side node.js methods which push updates to Google APIs based on database changes, so including the script tag on a client page won't do us much good.

[dmk12]

@john-osullivan No, I had no issues using a script tag whatsoever, our server API (Django/Python) is interacting with Google API just fine (we're mostly using the GApi functionality for registering/logging in users).

But we have the frontend React/Webpack app as a mediator for this interaction, so backend doesn't have to know anything about GApi's existence. If you need backend node.js to talk to it directly then a script tag is no good, as you said.

[andrewjaykeller]

Any update on this error? Still persisting over here in my Electron app with web pack :/

[cweems]

Just noting that I also encountered this issue. Ended up using a script tag instead.

[jmdobry]

google-api-nodejs-client is not meant to be used in a browser—it won't work. googleapis (google-api-nodejs-client) will work in Node.js. Excluding googleapis from any server-side bundle (just let Node's module system load it for you) is the best option.

To access Google APIs from a browser, please use the Google API Client Library for JavaScript (gapi).

[arufian]

+1 @jmdobry
case closed.

by the way, in case of fs you can ignore it by add this codes (though not related with this issue)

node: {
    console: 'empty',
    fs: 'empty',
    net: 'empty',
    tls: 'empty'
  }