Uncaught TypeError when running production code locally after targeting ES2015 in tsconfig.json

[aurerua]

Is this a bug report?

Yes.

Can you also reproduce the problem with npm 4.x?

Yes.

Which terms did you search for in User Guide?

• tsconfig.ts
• compilerOptions

Environment

1. npm ls react-scripts-ts (if you haven’t ejected): -
2. node -v: v10.4.1
3. npm -v: 6.1.0
4. yarn --version (if you use Yarn):
5. yarn ls react-scripts-ts (if you haven’t ejected): -

Then, specify:

1. Operating system: Ubuntu 18.04 LTS
2. Browser and version (if relevant): Google Chrome Version 67.0.3396.87 (Official Build) (64-bit)

Steps to Reproduce

(Write your steps here:)

1. npx create-react-app my-app --scripts-version=react-scripts-ts
2. cd my-app
3. npm run eject
4. npm run build
5. cd build
6. edit tsconfig.json and change the target value in compilerOptions to "ES2015"
7. npx http-server
8. In the browser run the page served by http-server and press CTRL-SHIFT-I to see the error message in the console.

Expected Behavior

No error in the console.

Actual Behavior

This error occurs in the browser's console:

Uncaught TypeError: Assignment to constant variable.
    at window.addEventListener (registerServiceWorker.ts:90)

I have found two ways to solve the problem:

• do not change the target value in compilerOptions...
• change line 37 in registerServiceWorker.ts from:

const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;

to

let swUrl;
swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;

Reproducible Demo

(Paste the link to an example project and exact instructions to reproduce the issue.)

[ulrichb]

Same here. This seems to be an open UglifyJS bug: mishoo/UglifyJS#2842.

Another workaround is to rename 'swUrl' in line 37.

[SMotaal]

I got the same error and also resolved it with:

src/registerServiceWorker.ts#L37:

    window.addEventListener('load', () => {
-      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
+      let swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;

I dug a little deeper into the built source only to find that somehow with all the garbage that transpilers throw into the mix the production build transpiled this file into the following junk:

build/static/js/main.<hash>.js formatted: L26143:

function(t, e, n) {
  "use strict";
  Object.defineProperty(e, "__esModule", {
    value: !0
  });
  const r = Boolean("localhost" === window.location.hostname || "[::1]" === window.location.hostname || window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/));
  function i(t) {
    navigator.serviceWorker.register(t).then(t=>{
      t.onupdatefound = (()=>{
        const e = t.installing;
        e && (e.onstatechange = (()=>{
          "installed" === e.state && (navigator.serviceWorker.controller ? console.log("New content is available; please refresh.") : console.log("Content is cached for offline use."))
        }
        ))
      }
      )
    }
    ).catch(t=>{
      console.error("Error during service worker registration:", t)
    }
    )
  }
  e.default = function() {
    if ("serviceWorker"in navigator) {
      if (new URL("",window.location.toString()).origin !== window.location.origin)
        return;
      window.addEventListener("load", ()=>{
        const t = "/service-worker.js";
        r ? (t = t,
        fetch(t).then(e=>{
          404 === e.status || -1 === e.headers.get("content-type").indexOf("javascript") ? navigator.serviceWorker.ready.then(t=>{
            t.unregister().then(()=>{
              window.location.reload()
            }
            )
          }
          ) : i(t)
        }
        ).catch(()=>{
          console.log("No internet connection found. App is running in offline mode.")
        }
        ),
        navigator.serviceWorker.ready.then(()=>{
          console.log("This web app is being served cache-first by a service worker. To learn more, visit https://goo.gl/SC7cgQ")
        }
        )) : i(t)
      }
      )
    }
    var t
  }
  ,
  e.unregister = function() {
    "serviceWorker"in navigator && navigator.serviceWorker.ready.then(t=>{
      t.unregister()
    }
    )
  }
}

Notice the mess around window.addEventListener about half way through.