Errori su build grunt usando google-api-nodejs-client con webpack

Question

Sto usando https://www.npmjs.com/package/googleapis in un'app Webpack ReactJS. Ha un avvertimento che si tratta di una versione alfa, quindi ci si devono aspettare problemi, ed ecco quello che sto avendo.

npm install googleapis --save installato googleapis ok, aggiunto "googleapis": "^2.0.2" al mio package.json, ma quando corro grunt build ottengo le seguenti avvertenze (seguiti da un sacco di errori che vi posterò su richiesta, in quanto è un sacco di testo) :

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 

La linea incriminata in ~/googleapis/apis/index.js è:

var Endpoint = require(endpointPath); 

Uno degli errori che sto ricevendo:

0.123.516,410617 millions

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 

codice che richiede googleapis nel mio componente Reagire:

var gapi = require('googleapis'); 

Nota: qualsiasi altro codice del componente può essere fornita su richiesta, ma non credo che sia rilevante per questo problema.

miei package.json dipendenze:

"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" 
} 

versione 2.5.1 npm

nodo versione v0.12.1

Grazie in anticipo per qualsiasi aiuto!

Answer 1

Non ho una risposta funzionante, ma ne sto cercando anche una. Sei dmk12 su GitHub? Altrimenti, uno sguardo a questo problema:

https://github.com/google/google-api-nodejs-client/issues/403

Sembra che parte del problema è che la biblioteca ha una linea

var Endpoint = require(endpointPath);

che deve essere valutata, come endpointPath è una variabile. Sfortunatamente, il problema dice che probabilmente non cambieranno questo comportamento, poiché rende il loro codice più flessibile. Una persona (forse tu?) Ha suggerito di aggirare questo problema caricando le API tramite il tag <script> in index.html, ma questo non funziona per noi --- il mio team e io vogliamo utilizzare l'API dal codice lato server.

La ricerca di una risposta continua.

Answer 2

Come chiarito dall'uso del browser comments of the project team, non supportato per il progetto google-api-nodejs-client. È solo per l'uso sul lato server.

Per risolvere il problema più ampio di come utilizzare le API di Google con un'app React Webpack, il client Gmail basato su Redux NuclearMail fornisce un esempio.

Al punto di ingresso di NuclearMail, index.html carica il fascio Webpack seguita dal carico API Google un handleGoogleClientLoad callback:

<script src="app.js"></script> 
 
<script src="https://apis.google.com/js/client.js?onload=handleGoogleClientLoad"></script>

Tale callback è definita src/API.js:

/* global gapi */ 
 

 
import ActionType from './ActionType'; 
 
import store from './store'; 
 

 
window.handleGoogleClientLoad = function() { 
 
    tryAuthorize(true); 
 
}; 
 

 
function tryAuthorize(immediate) { 
 
    store.dispatch({type: ActionType.Authorization.REQUEST}); 
 
    gapi.auth.authorize(
 
    { 
 
     /*eslint-disable camelcase*/ 
 
     client_id: '108971935462-ied7vg89qivj0bsso4imp6imhvpuso5u.apps.googleusercontent.com', 
 
     /*eslint-enable*/ 
 
     scope: 'email https://www.googleapis.com/auth/gmail.modify', 
 
     immediate 
 
    }, 
 
    whenAuthenticated 
 
); 
 
} 
 

 
function whenAuthenticated(authResult) { 
 
    if (authResult && !authResult.error) { 
 
    store.dispatch({type: ActionType.Authorization.SUCCESS}); 
 
    gapi.client.load('gmail', 'v1', whenLoaded); 
 
    } else { 
 
    store.dispatch({type: ActionType.Authorization.FAILURE}); 
 
    } 
 
}