Failed to build in production

[iashraful]

I have used like that, <Safe.p><div>Hello, World!</div></Safe.p>. And then, I'm facing to build in the production version.
See the Image

[ivan-kleshnin]

Thanks for reporting. I'll take a look.

[iashraful]

@ivan-kleshnin Then, moved to <h1 dangerouslySetInnerHTML={{__html: page.title}}></h1> this syntax. And it works for me fine.

[ivan-kleshnin]

The problem stems from React using UglifyJS which still does not support a single bit of ES6 syntax. And they aren't going to, choosing to release an alt. uglify-es instead.

React is sticking to basic uglify-js. There's an issue proposing to shift:
facebook/create-react-app#2108
but it's not done yet.

I can address this problem by adding a build step or by avoiding ES6 syntax.
As ES5 don't have even for-of loop the first seems to be the better option.

---

As for your example:

<Safe.div><div>test</div></Safe.div>
<div dangerouslySetInnerHTML={{__html: <div>test2</div>}}></div>

Both does not work as expected (rendering [object Object]) because both wait for a string.

The correct syntax is:

<Safe.div>{"<div>test</div>"}</Safe.div>
<div dangerouslySetInnerHTML={{__html: "<div>test2</div>"}}></div>

Passing React objects as strings can be handled but it does not seem right because HTML is a string by definition (as is JSON btw.).

[iashraful]

@ivan-kleshnin Thanks for your nice explanation. 👍

[ivan-kleshnin]

No problem :)

Should be fixed in 1.1.0. create-react-app production build works for me now.
Pls. close this issue if you confirm.