React-styleguidist: Build is broken: r is not defined

[lgordey]

Hi!
After updating to 6.2.0 most of components have an error:

Demo - https://github.com/lgordey/example

It reproduced only on build task - styleguide:build
In development mode everything seems fine

[lgordey]

I guess that the thing, that unite all crashed components - is they all have readme example with some text inside.
Cause examples with Placeholder or RandomButton don't have such error.

[sapegin]

Two funny facts:

1. I don’t see it when I build the basic styleguide in the main repo.
2. When I build your repo, I see slightly different error: ReferenceError: can't access lexical declarationr' before initialization`.

It feels like some new version of UglifyJS to me.

[sapegin]

Looks like so, of course they don’t have a change log 🤦‍♂️

[email protected] /Users/tema/_/react-styleguidist
└─┬ [email protected]
  └── [email protected]

[email protected] /Users/tema/example
└─┬ [email protected]
  └─┬ [email protected]
    └── [email protected]

[lgordey]

@sapegin yeap, if I completely remove new UglifyJSPlugin from make-webpack-config - everything is ok.

[lgordey]

of course they don’t have a change log :man_facepalming:

of course 😂

[lgordey]

I think they are not completely sure about uglify-es version 😄

[sapegin]

As a temporary workaround I guess you can add an older version of uglify-es as a dependency of your project. I'm still not sure what would be the right fix for that and what exactly is broken.

[bstream]

Ran in to the same error (I think, although for me it said ReferenceError: n is not defined. For me the error occurs with [email protected] but not with [email protected]. If you are using using [email protected] you can use the resolutions field for this, like so:

"resolutions": {
  "uglify-es": "3.3.7"
}

Also; maybe this is related? https://github.com/mishoo/UglifyJS2/issues/2842

[lgordey]

Updating to [email protected] inside react-styleguidist also should fix the problem, cause they freeze uglify-es version here https://github.com/webpack-contrib/uglifyjs-webpack-plugin/pull/199/files

[bluetidepro]

Yeah, I'm having this same problem with my builds, so a patch for this would be great.

[iamtyce]

I can confirm that @bstream's approach worked perfectly for us. Hoping to remove that when Uglify push a fix.

[diegohaz]

@bstream's workaround fixed it for me.

[alanbsmith]

oh, man. I'm so glad other people were seeing this too. I thought I was crazy. Can also confirm it's UglifyJS and @bstream 's workaround resolves it.

[nisargrthakkar]

I am using "react-styleguidist": "^7.3.2" and still facing the issue

Here is my HowItWorks.md

React component example:
```js
<HowItWorks contain='Hello I am here boss' />```

[GuptaWeber]

I am using "react-styleguidist": "^9.2.0" and still I am facing this issue.

It's working when if we manually import all the required dependencies for the project in the Styleguidist example. But my Repository has many packages and many examples. It ends in a lot of code repetition.

Is there any way to solve this?
Help me guys..!

[hamedmam]

I was able to work around this issue using this
https://stackoverflow.com/questions/46067207/how-to-add-examples-a-component-with-dependencies-in-react-styleguidist