Unexpected token ILLEGAL in Chrome 41 with react-scripts@2.0.0-next.b2fd8db8

[dmitrizzle]

Is this a bug report?

Yes.

Did you try recovering your dependencies?

Yes.

Environment

1. node -v: v8.4.0
2. npm -v: 5.8.0
3. yarn --version (if you use Yarn): 1.3.2
4. npm ls react-scripts (if you haven’t ejected): react-scripts@2.0.0-next.b2fd8db8

Then, specify:

1. Operating system: MacOS Sierra 10.12.6
2. Browser and version (if relevant): Chrome 41.0.2272.89

Steps to Reproduce

1

• Added the following to browserlist key in package.json:

"production": [
  "Chrome >= 41",
  "last 2 Safari versions",
  "last 2 FireFox versions",
  "last 1 Edge versions",
  "not dead",
  "last 2 iOS versions",
  "last 2 Android versions"
]

2

• yarn build - no errors, everything seems OK.

3

• serve -s build and open http://localhost:5000 in Chrome 41.

Expected Behavior

Browser displays the app with no JavaScript errors in console.

Actual Behavior

• Getting Uncaught SyntaxError: Unexpected token ILLEGAL error in Chrome 41.
• Modern Chrome (65) has no issues.

I have referred to the StackOverflow answer and went through the minified searching for weird characters and found none. I have also "beautified" the code and found no issues with it.

Reproducible Demo

https://github.com/dmitrizzle/Analog.Cafe - you may reproduce my steps by cloning the repo. You do not need to spin up API server to witness the issue, just the repo given. Please use develop branch.

[sidoruk-sv]

@dmitrizzle

Tried with WebStorm plugin: Zero Width Characters locator (maybe there are other solutions in different editors or even a command line tool for that).

And found this: http://take.ms/Z9kRE

Can you try to rewrite these "" with your own hands and check if the build is still failed.

---

@Timer what do you think about implementing some sanitizer (for example https://www.npmjs.com/package/cleanstr), or maybe detector of such bad characters 💀 and warn somewhere about them.

oh... already found eslint rule for that: https://eslint.org/docs/rules/no-irregular-whitespace

[dmitrizzle]

Hey @sidoruk-sv thank you for your help. I did replace the characters and ran a search throughout my /src folder using regular expression search in Atom and this table. Unfortunately I couldn't find any besides the ones you pointed out in <ArticleLoader /> component - yet Chrome 41 still shows the same error.

My guess is (assuming those characters are responsible) is that either my search is incomplete (there may be more than what's listed in the link above) or that they may be coming from a dependency which I have no control over.

Interestingly enough, I have not had these issues in Chrome 41 with the latest stable CRA (which I run with Array.prototype.includes and Array.prototype.find polyfills).

[danielberndt]

should be fixed now thanks to #4234