prod webpack build resulting in WSOD

[shankari]

on the current staging aria_and_fall_2023_rewrite branch,

I see this 100% reproducible issue

npm run build-dev-ios	npm run build-prod-ios

The prod webpack build seems to be generating a WSOD

[shankari]

seems to be related to the logger changes.

This is the new error that I see

[Error] Error: [$injector:unpr] Unknown provider: eProvider <- e <- Logger
http://errors.angularjs.org/1.6.7/$injector/unpr?p0=eProvider%20%3C-%20e%20%3C-%20Logger
	s (bundle.js:2:676461)
	c (bundle.js:2:676717)
	invoke (bundle.js:2:676805)
	(anonymous function) (bundle.js:2:675106)
	C (bundle.js:2:652856)
	Zt (bundle.js:2:675079)
	r (bundle.js:2:661208)
	(anonymous function) (bundle.js:2:827453)
	(anonymous function) (bundle.js:2:827469)
	n (bundle.js:2:667403)

Other errors are the transitions

[Error] transition superseded
ionic://localhost/dist/bundle.js:2 – "Possibly unhandled rejection: {}"
	(anonymous function) (bundle.js:2:709682)
	u (bundle.js:2:742932)
	$digest (bundle.js:2:748634)
	(anonymous function) (bundle.js:2:750265)
	f (bundle.js:2:683713)
	(anonymous function) (bundle.js:2:685070)
[Error] transition prevented
ionic://localhost/dist/bundle.js:2 – "Possibly unhandled rejection: {}"
	(anonymous function) (bundle.js:2:709682)
	u (bundle.js:2:742932)
	$digest (bundle.js:2:748634)
	(anonymous function) (bundle.js:2:750265)
	f (bundle.js:2:683713)
	(anonymous function) (bundle.js:2:685070)
[Error] transition aborted
ionic://localhost/dist/bundle.js:2 – "Possibly unhandled rejection: {}"
	(anonymous function) (bundle.js:2:709682)
	u (bundle.js:2:742932)
	$digest (bundle.js:2:748634)
	(anonymous function) (bundle.js:2:750265)
	f (bundle.js:2:683713)
	(anonymous function) (bundle.js:2:685070)
[Error] transition failed
ionic://localhost/dist/bundle.js:2 – "Possibly unhandled rejection: {}"
	(anonymous function) (bundle.js:2:709682)
	u (bundle.js:2:742932)
	$digest (bundle.js:2:748634)
	(anonymous function) (bundle.js:2:750265)
	f (bundle.js:2:683713)
	(anonymous function) (bundle.js:2:685070)

[JGreenlee]

[JGreenlee]

This is the type of error we were experiencing before because our Angular code does not have explicit annotations.

We solved this by adding babel-plugin-angularjs-annotate. So why isn't that working in this instance?

[JGreenlee]

This is how that is configured in webpack:

    rules: [
      /* In production, Webpack minifies JS files and randomizes variable names.
          This causes problems with AngularJS unless you use explicit annotations,
          which we don't.
          https://docs.angularjs.org/error/$injector/strictdi
          (The syntax we use is like the 'bad' example: implicit annotations)
          So rather than change every file in our codebase, I'm adding this
          babel plugin which basically preprocesses our 'bad' code into 'good' code.
        Only needed on production because minification doesn't happen on dev. */
      {
        test: /\.(js)$/,
        include: path.resolve(__dirname, 'www'),
        loader: 'babel-loader',
        options: {
          presets: ['@babel/preset-env'],
          plugins: ["angularjs-annotate"],
        },
      },
      {
        test: /\.(js|jsx|ts|tsx)$/,
        loader: 'babel-loader',
        options: {
          presets: ['@babel/preset-env', '@babel/preset-react', '@babel/preset-typescript'],
        },
      },
    ],

[JGreenlee]

Ah, it's because I added some functions at the end of the logger file, and in the process I renamed logger.js -> logger.ts so that the new functions could be typed.

But angularjs-annotate is only applied to *.js files

[JGreenlee]

Having angularjs-annotate also be applied to .ts files will add some time to the build process.

I think the simplest solution here is either 1) just don't put any Angular code in TypeScript or 2) if you do, use explicit annotations so the plugin doesn't have to fix them

[JGreenlee]

Because I want to fix this ASAP, I think (2) is the quickest solution right now

[JGreenlee]

e-mission/e-mission-phone#1020

[shankari]

Verified on the NREL OpenPATH app; updating production staging...

[JGreenlee]

Testing was done in the devapp with a prod webpack bundle to confirm that the issue was resolved.

@JGreenlee I assume you tested this with a prod webpack build and it worked?

Yes, I tested it in the devapp with a prod webpack bundle.

That setup is where I observed the error before the change, and no error after