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.


Hello, I was trying to use ElementUI with react-express-views and when I’m trying to use Button (or any other component) I get an error

Reproduce Steps

  1. Set up express server with express-react-views
const express     = require('express');
const consoleUtil = require('../util/consoleUtil.js');

const app = express();

app.set('views', __dirname + '/views');
app.set('view-engine', 'jsx');
app.engine('jsx', require('express-react-views').createEngine());

const router = express.Router();
app.use('/', router);

router.get('/', (req, res, next) => {
    res.render('main/test.jsx', {
        test: 'test text',
        title: 'test title'

app.listen(8080, () => {
    consoleUtil.log('Webserver running...')
  1. Make test.jsx template in views folder
const React     = require('react');
const ElementUI = require('element-react');

class TestLayout extends React.Component {
    render() {
        return (

module.exports = TestLayout;
  1. Run the server and go to localhost:8080

Error Trace (if possible)

ReferenceError: document is not defined
    at Object.<anonymous> (/home/jas777/Venom/node_modules/element-react/dist/npm/es5/src/table/TableHeader.js:45:17)
    at Module._compile (internal/modules/cjs/loader.js:654:30)
    at Module._extensions..js (internal/modules/cjs/loader.js:665:10)
    at Object.require.extensions.(anonymous function) [as .js] (/home/jas777/Venom/node_modules/babel-register/lib/node.js:152:7)
    at Module.load (internal/modules/cjs/loader.js:566:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:506:12)
    at Function.Module._load (internal/modules/cjs/loader.js:498:3)
    at Module.require (internal/modules/cjs/loader.js:598:17)
    at require (internal/modules/cjs/helpers.js:11:18)
    at Object.<anonymous> (/home/jas777/Venom/node_modules/element-react/dist/npm/es5/src/table/Table.js:37:20)


No idea

Additional Information

Any additional information, configuration or data that might be necessary to reproduce the issue.

Issue Analytics

  • State:open
  • Created 5 years ago
  • Comments:5

github_iconTop GitHub Comments

Jezfxcommented, Sep 25, 2019

Cheers @n8tb1t Ended up using a similar solution together with loadable to work with Gatsby.

Button = loadable((): any => import("element-react/dist/npm/es6/src/button"))

This did give me import issues when testing with Jest. However, managed to get around it by setting the moduleNameMapper to load element-react instead

moduleNameMapper: {
 "src/components/wrapper": "element-react",

ondrejrohoncommented, Jul 12, 2019

this issue is still present in 1.4.33 😕

edit: I was able to overcome this issue by loading this problematic component dynamically using [loadable components](smooth-code/loadable-components: React code splitting … - GitHub

this however doesn’t solve this issue if you need to render anything from element-react on server…

Read more comments on GitHub >

github_iconTop Results From Across the Web

SSR problems and issues | Chevy SSR Forum
Hi, all. I just joined because I have been searching for an SSR and would like to know what the known issues are...
Read more >
Chevrolet SSR - problems, statistics, and analysis
The following chart shows the 16 most common problems for Chevrolet SSR cars. The number one most common problem is related to the...
Read more >
The Real Reason The Chevrolet SSR Failed - HotCars
It seems like an automobile that suffered from “wrong place, wrong time” syndrome. There was a lot of hype for the SSR before...
Read more >
Chevy SSR Transmission Problems & Cost
Problem – A common Chevrolet SSR transmission problem is an intermittent hard 1-2 shift, often accompanied by engine bogging. This condition can be...
Read more >
2004 Chevrolet SSR Problems | Kelley Blue Book
How reliable is the 2004 Chevrolet SSR? See the most common repairs performed and learn if your vehicle is at risk for major...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found