Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

ReferenceError: document is not defined

See original GitHub issue

Out of the sudden, after several succesful npm start build I’m getting this error since today on productive build (no problem on debug)

ReferenceError: document is not defined
    at Object.<anonymous> (/Users/me/myApp/node_modules/domkit/builtinStyle.js:3:18)
    at Module._compile (module.js:569:30)
    at Module._extensions..js (module.js:580:10)
    at Object.require.extensions.(anonymous function) [as .js] (/Users/me/myApp/node_modules/babel-register/lib/node.js:152:7)
    at Module.load (module.js:503:32)
    at tryModuleLoad (module.js:466:12)
    at Function.Module._load (module.js:458:3)
    at Module.require (module.js:513:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/me/myApp/node_modules/domkit/getVendorPropertyName.js:3:20)
    at Module._compile (module.js:569:30)
    at Module._extensions..js (module.js:580:10)
    at Object.require.extensions.(anonymous function) [as .js] (/Users/me/myApp/node_modules/babel-register/lib/node.js:152:7)
    at Module.load (module.js:503:32)
    at tryModuleLoad (module.js:466:12)
    at Function.Module._load (module.js:458:3)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! myapp-java-dashboard@0.0.4 build: `react-static build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the myapp-java-dashboard@0.0.4 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/me/.npm/_logs/2018-01-09T16_53_26_006Z-debug.log

Any idea, where to search?

Issue Analytics

State:
Created 6 years ago
Comments:11 (8 by maintainers)

Top GitHub Comments

8reactions

tannerlinsleycommented, Jan 9, 2018

This is usually a result of your code (or a library you’re importing) relying on the browser’s document variable in a place that runs before react actually mounts.

A simple approach to fix this is to search for instance of document and replace them with this:

if (typeof document !== 'undefined') {
  ... use document
}

If that doesn’t work, make sure any libraries you are importing that use document immediately are proxied like so:

let MyLibrary
if (typeof document !== 'undefined') {
  MyLibrary = require('my-library').default
}

2reactions

neilyoungcommented, Jan 9, 2018

OK, found it:

let PulseLoader
if (typeof document !== 'undefined')
  PulseLoader = require('halogenium/lib/PulseLoader')

Top Results From Across the Web

How to fix ReferenceError: Document is not defined in ...

The most common reason for getting the reference error while on the browser is when you try to access the document object too...

ReferenceError: document is not defined in JavaScript

The "ReferenceError: document is not defined" error occurs for multiple reasons: ... The document relates to the document object which represents a web...

ReferenceError: document is not defined (in plain JavaScript)

Explanation: The error is caused because NextJs renders the page in the server only and in the server document (document is used inside...

How To Fix ReferenceError document is not defined in ...

If you are trying to use the document object and receiving a ReferenceError: document is not defined error then there is a good...

How to solve the document is not defined error

Here's how to fix the “referenceerror: document is not defined” error that you might have in Node.js or with a tool like Next.js....