Search code examples
javascripthtmlangulargoogle-app-enginegoogle-cloud-platform

Angular i18n not working when pushing to production on Google App Engine


I'm experiencing an issue with an Angular application that uses i18n for internationalization. The application works perfectly fine when serving it locally, but I encounter problems when pushing it to production on Google App Engine.

Specifically, my JavaScript and CSS files are not being loaded correctly, with the error message indicating that the server responded with a MIME type of "text/html". Here are the exact error messages I'm seeing:

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

Here is my app.yaml configuration:

runtime: python27
api_version: 1
threadsafe: true

handlers:
- url: /assets/i18n
  static_dir: dist/nordwebb/assets/i18n
- url: /(.*\.json)
  mime_type: application/json
  static_files: dist/nordwebb/\1
  upload: dist/nordwebb/.*\.json$
- url: /(.*\.css)
  mime_type: text/css
  static_files: dist/nordwebb/\1
  upload: dist/nordwebb/.*\.css$
- url: /(.*\.js)
  mime_type: application/javascript
  static_files: dist/nordwebb/\1
  upload: dist/nordwebb/.*\.js$
- url: /.*
  static_files: dist/nordwebb/index.html
  upload: dist/nordwebb/index.html

skip_files:
- e2e/
- node_modules/
- src/
- coverage/
- ^(.*/)?\..*$
- ^(?!.*assets/i18n/.*\.json$).*\.json$
- ^(.*/)?.*\.md$
- ^(.*/)?.*\.yaml$
- ^LICENSE

Any help would be greatly appreciated.


Solution

  • The reason why this did not work was because I was skipping all the JSON files when pushing to production which made my i18n completly break. I removed the JSON skip under the app.yaml and it worked fine.