Search code examples
gridsome

Build fails with ReferenceError: window is not defined

When I run gridsome build I get

ReferenceError: window is not defined
at Object. (src/gapi_client.js:1:9)
at webpack_require (webpack/bootstrap:25:0)
at Module. (assets/js/app.f322a6ac.js:68956:19)
at webpack_require (webpack/bootstrap:25:0)
at Object. (assets/js/app.f322a6ac.js:56344:18)
at webpack_require (webpack/bootstrap:25:0)
at assets/js/app.f322a6ac.js:118:18
at Object. (assets/js/app.f322a6ac.js:121:10)
at o (/home/s/somegrid/node_modules/vue-server-renderer/build.prod.js:1:77607)
at /home/s/somegrid/node_modules/vue-server-renderer/build.prod.js:1:78200

my main.js has import './gapi_client' at the very top.

My env:

System:
OS: Linux 4.15 Ubuntu 18.04.4 LTS (Bionic Beaver)
CPU: (2) x64 AMD A6-4400M APU with Radeon(tm) HD Graphics
Binaries:
Node: 11.6.0 - /usr/local/bin/node
Yarn: 1.15.2 - ~/.yarn/bin/yarn
npm: 6.13.6 - /usr/local/bin/npm
Browsers:
Chrome: 81.0.4044.113
Firefox: 75.0
npmPackages:
gridsome: ^0.7.14 => 0.7.14
npmGlobalPackages:
@gridsome/cli: 0.3.1

Some questions:

  1. Why is gapi_client.js referencing window?

  2. Should gapi_client.js be imported only when process.isClient is true?

I changed the code in main.js as follows:

if (process.isClient) {
window.gapi_client = require('./gapi_client')
}

Now my build seems to go thru that step but fails with

Error: No native build was found for runtime=node abi=67 platform=linuxglibc arch=x64
at Function.module.exports.load.path (node_modules/node-gyp-build/index.js:56:0)
at load (node_modules/node-gyp-build/index.js:18:0)
at Object. (node_modules/leveldown/binding.js:1:41)
at Object. (assets/js/app.ce34d4e7.js:28227:30)
at webpack_require (webpack/bootstrap:25:0)
at Object. (node_modules/leveldown/leveldown.js:3:16)
at webpack_require (webpack/bootstrap:25:0)
at Object. (node_modules/level/level.js:1:43)
at webpack_require (webpack/bootstrap:25:0)
at Object. (assets/js/app.ce34d4e7.js:9411:13)
Solution

  • I changed the code to:

    if (process.isClient) {
    window.gapi_client = require('./gapi_client').default
}

    And it works!