Angular4 und WebApp2 auf Google App Engine

Question

Ich benutze derzeit ein Angular4 projiziert von angular-CLI generiert, um die Projektstruktur zu erstellen, und ich konnte es mit ng-dienen dienen und entwickeln und sehen Änderungen. Jetzt möchte ich es in meine eigene Backend gehostet werden, mit Google App Engine und WebApp2 und führen Sie es mit dev_appserver.py app.yaml. Zurzeit kann ich es nur mit einem ng-build ausführen und die Dateien aus dem Ordner dist bereitstellen. Ich möchte es so machen, dass ich leicht Änderungen vornehmen kann, aber nicht warten muss, bis es jedes Mal neu aufgebaut wird.

Answer 1

Sie können Umgebung auf angular verwenden, um Sie Python Rest Service und eine andere Umgebung auf die Produktion zu zeigen.

Beispiel:

enviroment.ts

 
export const environment = { 
    production: false, 
    urlServices: 'http://190.52.112.41:8075' 
}; 

enviroment.prod.ts

 
export const environment = { 
    production: true, 
    urlServices: 'http://localhost:8080' 
}; 

Auf diese Weise brauchen Sie nicht zu kompilieren Sie zu testen aplication weil eckig wird immer auf Sie Python-App verwiesen.

Answer 2

Eine app.yaml Lösung unter Verwendung der Standard-App Engine config:

service: stage 
runtime: python27 
api_version: 1 
threadsafe: true 

skip_files: 
- ^(?!dist) # Skip any files not in the dist folder 

handlers: 
# Routing for bundles to serve directly 
- url: /((?:inline|main|polyfills|styles|vendor)\.[a-z0-9]+\.bundle\.js) 
    secure: always 
    redirect_http_response_code: 301 
    static_files: dist/\1 
    upload: dist/.* 

# Routing for a prod styles.bundle.css to serve directly 
- url: /(styles\.[a-z0-9]+\.bundle\.css) 
    secure: always 
    redirect_http_response_code: 301 
    static_files: dist/\1 
    upload: dist/.* 

# Routing for typedoc, assets and favicon.ico to serve directly 
- url: /((?:assets|docs)/.*|favicon\.ico) 
    secure: always 
    redirect_http_response_code: 301 
    static_files: dist/\1 
    upload: dist/.* 

# Any other requests are routed to index.html for angular to handle so we don't need hash URLs 
- url: /.* 
    secure: always 
    redirect_http_response_code: 301 
    static_files: dist/index.html 
    upload: dist/index\.html 
    http_headers: 
    Strict-Transport-Security: max-age=31536000; includeSubDomains 
    X-Frame-Options: DENY 

Suchen Sie für jedes Feedback, wie ich das besser machen könnte.