Angular 2 Typoskript zu Javascript?

Question

Momentan umschlinge ich immer noch das gesamte Angular 2-Konzept. Ich habe AngularJS (1) in der Vergangenheit benutzt und es hat mir gefallen.

So im Moment fange ich ein neues Projekt an und dachte, warum nicht Angular 2 verwenden. Jetzt weiß ich, dass jeder Typescript anstelle von Javascript verwendet. Ich bin jedoch immer noch unsicher, wie man ein Projekt auf einem einfachen Webhosting-Server (PHP, HTML, MySQL, Javascript usw.) ausführen kann.

Ich weiß, ich kann npm Start auf meinem Linux-Server ausführen, aber wie legt man es auf einen Hosting-Server? Kann ich das Typescript nicht einfach zu Javascript kompilieren, damit ich es in einem Browser verwenden kann, ohne npm ausführen zu müssen? Ich habe etwas über JSPM und einige andere gelesen, aber ich bin mir nicht sicher, ob ich das brauche oder wie ich es mit JSPM o.ä. ausführen kann (zum Beispiel mit dem "unter 5 Minuten Schnellstart" mit JSBPM).

Ich weiß, Angular 2 hat einen Javascript-Teil, und das funktioniert für mich. Es gibt jedoch keine Codierungsbeispiele, und alles, was Sie im Internet finden, ist Typoskript. Also kann ich Angular 2 in Javascript nicht ausführen, weil das Fehlen von Tutorials.

Kurz gesagt, ich habe keine Probleme mit Typoskript, aber ich will nur ein reines Javascript als Ergebnis, das ich in HTML importieren und von dort aus gehen kann.

Auch auf einer Randnotiz Frage, müssen alle node_module vorhanden sein, wenn die Produktion läuft?

Bonuspunkte für Tutorials, die das erklären!

Danke!

Answer 1

In der Tat ist es ein Dokument auf der Website angular.io bezüglich dieser:

• https://angular.io/docs/ts/latest/cookbook/ts-to-js.html

Es zeigt den Weg Typoskript Code zu transformieren ein bis ES5 und es scheint, dass es ist, was du schaust nach. Hier

ist ein Beispiel:

• Typoskript

  import { Component } from '@angular/core'; 
  
  @Component({ 
      selector: 'hero-view', 
      template: 
      '<h1>Hero: {{getName()}}</h1>' 
  }) 
  export class HeroComponent { 
      title = 'Hero Detail'; 
      getName() {return 'Windstorm';} 
  } 
  

• ES5

  function HeroComponent() { 
      this.title = "Hero Detail"; 
  } 
  
  HeroComponent.annotations = [ 
      new ng.core.Component({ 
      selector: 'hero-view', 
      template: 
       '<h1>Hero: {{getName()}}</h1>' 
      }) 
  ]; 
  HeroComponent.prototype.getName = 
      function() {return 'Windstorm';}; 
  

  wo es auf diese Weise getan werden kann ;-)

  function HeroComponent() { 
      this.title = "Hero Detail"; 
  } 
  
  var HeroComponent = new ng.core.Component({ 
      selector: 'hero-view', 
      template: 
      '<h1>Hero: {{getName()}}</h1>' 
  }).Class({ 
      constructor: function() { 
      }, 
  
      getName: function() { 
      return 'Windstorm'; 
      } 
  }); 
  

In Bezug auf die Verpackung einer Angular2 Anwendung könnte diese Frage, die Sie interessiert auch:

• How do I actually deploy an Angular 2 + Typescript + systemjs app?

Answer 2

Mehrere Dinge hier. TypeScript ist kein JavaScript; Es ist eine von Microsoft entwickelte Sprache, die Webentwicklern hilft, besseren und sichereren Code zu erstellen, und sie muss in JavaScript übersetzt (kompiliert) werden, damit sie für den Browser verständlich ist (ich glaube nicht, dass TS Browser-kompatibel ist, aber vielleicht in Zukunft). .

Aus diesem Grund haben Angular 2-Entwickler eine Typoskript-Möglichkeit zur Verwendung ihres Frameworks gewählt.

In Angular 2 documentation finden Sie eine Beschreibung, wie Sie von Typoskript zu JavaScript gehen können.

Wenn Sie Ihre js-Dateien haben, legen Sie sie einfach auf jeden Produktionsserver, wie Sie es für eine normale Website tun werden.

Über npm start: Es ist nur ein Entwicklerwerkzeug, das Ihnen hilft, Ihre Entwicklungsumgebung mit einem leichten Webserver (nodejs) einzurichten, und sollte nicht in der Produktion verwendet werden.

Also kurz gesagt sollten Sie:

1. Schreiben Sie HTML, CSS und Typoskript auf Ihrer Entwicklungsmaschine (mit npm start, wenn Sie nicht wollen, einen Web-Server verwenden).

2. Verwenden Sie einen TypeScript-Compiler, um Ihr JavaScript (ES5 oder ES6) zu generieren.

3. Stellen Sie Ihre HTML-, CSS- und kompilierten JavaScript-Dateien auf den Produktionsserver (keine Notwendigkeit für nodejs dort).