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.

support for builds with server-side rendering

See original GitHub issue

When using SSR (for example, with something like Razzle), window cannot be assumed as an existing global, because it does not exist at the time of the build (the code has to be evaluated on the server), so such uses need to reserved for function execution.

/mnt/d/Git/test/confetti-razzle/node_modules/canvas-confetti/src/confetti.js:370
}());
 ^
ReferenceError: window is not defined
    at /mnt/d/Git/test/confetti-razzle/node_modules/canvas-confetti/src/confetti.js:4:5
    at /mnt/d/Git/test/confetti-razzle/node_modules/canvas-confetti/src/confetti.js:31:4
    at Object.<anonymous> (/mnt/d/Git/test/confetti-razzle/node_modules/canvas-confetti/src/confetti.js:370:2)
    at Module._compile (internal/modules/cjs/loader.js:956:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:973:10)
    at Module.load (internal/modules/cjs/loader.js:812:32)
    at Function.Module._load (internal/modules/cjs/loader.js:724:14)
    at Module.require (internal/modules/cjs/loader.js:849:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at Object.canvas-confetti (/mnt/d/Git/test/confetti-razzle/external "canvas-confetti":1:1)

Issue Analytics

State:
Created 4 years ago
Comments:6 (3 by maintainers)

Top GitHub Comments

1reaction

catdadcommented, Jan 16, 2021

This was definitely my fault. Thanks for catching this issue! I just published 1.3.3 that should work now (it worked for me in the gatsby starter app).

0reactions

lorensrcommented, Apr 6, 2021

Updating from 0.0.3 to 1.4.0 fixed this for me 😆. Thank you!

Top Results From Across the Web

Supporting Server Side Rendering - Stylable

Supporting Server Side Rendering ... Server side rendering (SSR) is an approach to serving JavaScript rendered web applications (such as React, Vue, Angular,...

Demystifying Server Side Rendering: Let's build our own SSR ...

In this article, I'm going to show you how you can write an SSR framework that allows for static site generation and dynamic...

Server-Side Rendering - Vite

Vite provides built-in support for server-side rendering (SSR). The Vite playground contains example SSR setups for Vue 3 and React, which can be...

A hands-on guide for a Server-Side Rendering React app

A hands-on guide for a Server-Side Rendering React app · Terminologies · Create React App and CSR · Deploy the Production Build With...

Why Should You Build a Server-Side Rendered React App?

Server -side rendering is worth the effort, as it can significantly improve your application's performance, SEO-friendliness, and traffic.