Uncaught TypeError: Super expression must either be null or a function, not undefined

[matiasmenker]

Is this a bug report?

Yes

Did you try recovering your dependencies?

Yes

Which terms did you search for in User Guide?

Yes i do

Environment

System:
OS: macOS 10.14.5
CPU: (4) x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
Binaries:
Node: 8.11.3 - /usr/local/bin/node
Yarn: 1.15.2 - /usr/local/bin/yarn
npm: 5.7.1 - /usr/local/bin/npm
Browsers:
Chrome: 74.0.3729.169
Firefox: 64.0.2
Safari: 12.1.1
npmPackages:
react: ^16.8.6 => 16.8.6
react-dom: ^16.8.6 => 16.8.6
react-scripts: 3.0.1 => 3.0.1
npmGlobalPackages:
create-react-app: Not Found

Steps to Reproduce

1. Create the build for production
2. Server the build with serve
3. Enter on the url that serve give for my

Expected Behavior

Server the build with a normal behave ( normal means the same that i have on a development build )

Actual Behavior

Yes, the app give a this error:

Uncaught TypeError: Super expression must either be null or a function, not undefined

Here inside the error:

Reproducible Demo

1. Create a react app with cra
2. Install this library https://github.com/dexma/ui-components
3. Make a build to production
4. Server the build with serve npm package

COMMENT:

I solved this problem putting keep_fnames: true on the minimizer plugin TerserPlugin options.

If you pass true to keep_fnames you prevent the compressor from discarding function names. Useful for code relying on Function.prototype.name

[mrmckeb]

Thanks for updating this issue @menkermatias. It looks like the library author is minifying their code, which I think contributes to the issue (really, this shouldn't be needed as the client's Webpack config does it).

I'm not sure what to do here, but perhaps we can close the issue and leave it here as a reference for future?

[matiasmenker]

@mrmckeb Thanks! I think it will be nice to have this reference, by the way, do you think it's necessary can create a PR to prevent the compressor from discarding function names?

[mrmckeb]

@menkermatias, I think that this shouldn't be necessary... if Terser is working correctly. I think we first need to understand where it's happening, and then look to fix the root cause.

[jilliankeenan]

any further updates on this?

[roadev]

any further updates on this?

+1

[matiasmenker]

I solved this problem putting keep_fnames: true on the minimizer plugin TerserPlugin options, @jilliankeenan @roadev did you try it?

[roadev]

I changed the plugin, It was almost one year ago haha

[Ploppz]

@matiasmenker Having this exact problem. However I just learned that in order to change the webpack config, you have to eject? Or is there a way around that?

[jilliankeenan]

@Ploppz You can do a config override using react-app-rewired

I added the following code to a file called config-overrides.js in the root directory of our project. This resolved our issue.

const TerserPlugin = require('terser-webpack-plugin');

module.exports = function override(config, env) {
  config.optimization = {
    minimizer: [
      new TerserPlugin({
        terserOptions: { keep_fnames: false }, 
      }),
    ],
  };
  return config;
};

[Ploppz]

Thansk @jilliankeenan . Did you mean keep_fnames: true? I tried either but still have the same problem though