Support Forums

"document" is not available during server side rendering

Hey there :

I do not understand everything around that but since I’ve been trying to use a special npm package, I’m getting this error

I have basically a tree where I basically display informations of people. Sorry for the messy code

Ever since I imported

import { Tree, TreeNode } from "react-organizational-chart";
import styled from "@emotion/styled";

what it asked, Netlify deployments has been crashing (while not causing any issue locally - I know that’s a nice joke)

Is there something I am missing out on my code (which I sincerely suspect)
Could this be related ?

Thanks for the help and sorry about that. :frowning:

while not causing any issue locally

Just to make sure: Did you try building your site locally or are you talking about running gatsby develop?

In any case, if that specific package is causing the issue, it might be more feasible to raise the topic on their Github page.

I am locally building the website with the command npm run start, that launches the following :

gatsby-starter-netlify-cms@1.1.3 start C:\Users\a.x.GOP-LINK\Documents\Workspace\gatsby-starter-netlify-cms
npm run develop

gatsby-starter-netlify-cms@1.1.3 develop C:\Users\a.x.GOP-LINK\Documents\Workspace\gatsby-starter-netlify-cms
npm run clean && gatsby develop

gatsby-starter-netlify-cms@1.1.3 clean C:\Users\a.x.GOP-LINK\Documents\Workspace\gatsby-starter-netlify-cms
gatsby clean

It doesn’t cause any problem, isn’t the server doing the same thing on its side ?

Oh edit :

[=====================       ]   8.111 s 59/79 75% Generating image thumbnails
        throw ex;

Error: Callback was already called.
    at throwError (C:\Users\a.x.GOP-LINK\Documents\Workspace\gatsby-starter-netlify-cms\node_modules\neo-async\async.js:16:11)
    at C:\Users\a.x.GOP-LINK\Documents\Workspace\gatsby-starter-netlify-cms\node_modules\neo-async\async.js:2818:7 
    at processTicksAndRejections (internal/process/task_queues.js:79:11)
npm ERR! errno 7
npm ERR! gatsby-starter-netlify-cms@1.1.3 build: `npm run clean && gatsby build`
npm ERR! Exit status 7
npm ERR!
npm ERR! Failed at the gatsby-starter-netlify-cms@1.1.3 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!     C:\Users\a.x.GOP-LINK\AppData\Roaming\npm-cache\_logs\2021-11-17T08_26_07_892Z-debug.log

Seems like I have a problem with gatsby build as well. Not really the same one but I have to look for that.

Well. I tried to update dependencies and I fucked up my whole Netlify and my devs : here is a sample of what I can’t run anymore :

npm run clean && gatsby develop →

      throw new ERR_REQUIRE_ESM(filename, parentPath, packageJsonPath);

Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: C:\Users\x.GOP-LINK\Documents\Workspace\gatsby-starter-netlify-cms\node_modules\remark-mdx\index.js
require() of ES modules is not supported.

Then, my sass went ???

Generating development JavaScript bundle failed
$black: #2b2523
Invalid CSS after "$black": expected 1 selector or at-rule, was ": #2b2523"
in C:\Users\x.GOP-LINK\Documents\Workspace\gatsby-starter-netlify-cms\src\components\all.sass (line 4, column 1)

and got a tons of error with sass, scss coming from node modules…

Why does it have to be when I want to show my progress to my team :frowning: ?

I’ve been looking for these errors on the internet :

tried to delete package-lock.json
node_modules, did the npm install nothing is working.

Please help me.

Here is my package.json, and I don’t know what to fix.

Nevermind, deleted the whole project on windows, opened a new one, everything is fine once again for my dev build, I have to look out for the build though.

1 Like

Hey there, @FCS :wave:

Glad everything is fine now! Thanks for letting us know :slight_smile:

The building error is still going on, I just have resolved the dev build.