My React app is not displaying anything after fixing errors

Question

I don't have any errors with my code, but my localhost shows nothing, its all blank now. I don't know how to fix it

I previously had a bunch of random errors with fs, tls, net, path, zlib, http, https, stream, crypto. I looked up a help and found this so i added it to my code and it looks like this

fallback: {
    "fs": false,
    "tls": false,
    "net": false,
    "path": false,
    "zlib": false,
    "http": false,
    "https": false,
    "stream": false,
    "crypto": false,
    "crypto-browserify": require.resolve('crypto-browserify'), //if you want to use this module also don't forget npm i crypto-browserify
    "./zlib_bindings": false,
    async_hooks: false,

after that i had a problem with

WARNING in ./node_modules/express/lib/view.js 72:13-25 Critical dependency: the request of a dependency is an expression

after that i added

externals: {
      express: 'express',
    },

(all of this on 'webpack.config.js')

score 0 · Accepted Answer · answered Nov 05 '22 at 16:56

All of your problems are indicative you have imported server code into the client. You can't run code built for Node.js in the browser, and webpack shouldn't even be touching express, etc.

That you had errors about missing libs like HTTP etc is further proof of this.

The solution is not to do any of this (fallback included). It's to find where you have either:

Accidentally imported your own server code inside a file meant to be run in the browser.
Used a third-party dependency in the client code that was actually meant for node and not the browser.

Sometimes this can happen if you do lots of named imports like import { thing } from './my-thing' implying there is an index.js file somewhere. If an index file exports both server and client code, and the client imports just one of them (even though the thing it imports is for the browser) it'll still blow up as webpack can't evaluate the other files.

My React app is not displaying anything after fixing errors

1 Answers1