GCP App Engine / Angular - Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html"

Question

I am trying to host an Angular app on Google Cloud Platform using the App Engine. The problem is that after I have succesfully deployed it, I am able to access it for about 2-3 minutes, hit refresh and not get HTTP error 404, but after those 2-3 minutes I am receiving the following errors in Chrome (colleagues receive the same error on their machines as well):

I have tried building my angular app using:

ng build --prod
ng build --prod --base-href sep6-app

Angular app folder structure:

- dist/
  - sep6-app/
  - app.yaml

My app.yaml:

runtime: python27
api_version: 1
threadsafe: true

handlers:

- url: /.*
  static_files: sep6-app/index.html
  upload: sep6-app/index.html

- url: /.*
  static_dir: sep6-app

Inside GCP, my storage bucket contains:

- app.yaml
- sep6-app/

One thing, if I set the URL's inside app.yaml like this, and then redeploy:

- url: /
  static_files: sep6-app/index.html
  upload: sep6-app/index.html

- url: /
  static_dir: sep6-app

I am able to access my app with no problem, but then if I refresh any of the pages I get the 404 error, which I understand is expected due to the way Angular deals with routes. However I do not understand why having "- url: /.*" works for short time and then stops?

I'm using (in case this is needed):

Angular CLI: 9.1.7
Angular: 9.1.9

Any thoughts or ideas on why this might be happening, and how this can be fixed? Thanks!

RollerMobster · Accepted Answer · 2020-05-24 21:49:26Z

5

Managed to get it working by using the following app.yaml:

runtime: python38
service: default

handlers:
- url: /(.*\.(gif|png|jpg|less|json|woff|woff2|ttf|eot|scss|css|js|ico|svg)(|\.map))$
  static_files: sep6-app/\1
  upload: sep6-app/(.*)(|\.map)
- url: /(.*)
  static_files: sep6-app/index.html
  upload: sep6-app/index.html

answered May 24, 2020 at 21:49

RollerMobster

9842 gold badges10 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

RollerMobster Over a year ago

@MaríaCristinaFernándezLópez Yes it did, are you still facing a problem?

Collectives™ on Stack Overflow

GCP App Engine / Angular - Failed to load module script: The server responded with a non-JavaScript MIME type of "text/html"

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related