Angular 8 ng-build throwing MIME error with cordova

I had the same issue.

  1. Created a new project.
  2. Built a production version

      "build-production": "ng build --configuration=production --extract-css=false --prod --aot"
    
  3. Deployed to NGINX

  4. White page with no content between tags in Chrome Element inspector

Fix

Update tsconfig.json

        "target": "es5",

Then rebuild the application and deploy again.

This solution worked for me, I now have content in my deployed app.

Hope it helps somebody


I have this same issue (similar) when creating an angular / electron app.

I follow the steps here:

https://alligator.io/angular/electron/

and I just get a blank (white) screen when I run the electron app. When you inspect the app with dev tools, you get a handful of error messages in the console like:

Failed to load module script: The server responded with a non-JavaScript MIME type of "". Strict MIME type checking is enforced for module scripts per HTML spec.

These appear on all the JS includes that are present in the dist/index.html file.

I have to manually go through all the script tags (like this):

<script src="runtime-es2015.858f8dd898b75fe86926.js" type="module">

and change them to include a mime type:

<script src="runtime-es2015.858f8dd898b75fe86926.js" type="text/javascript">

Only then does it work inside the electron window. If I run project using "ng serve", though, and look at the webpage served up by angular, then it works just fine.

I think it's something to do with files being loaded locally from the file system and not providing a mime type, while when they are served from a webserver, a mime type is provided.


You must change the property "target" in the file "tsconfig.json" to "es5". Read this blog entry, "Differential Loading by Default":

https://blog.angular.io/version-8-of-angular-smaller-bundles-cli-apis-and-alignment-with-the-ecosystem-af0261112a27

This property chooses between modern or legacy JavaScript based on the browser capabilities:

<script type="module" src="…"> // Modern JS

<script nomodule src="…"> // Legacy JS