Angular 2 typescript 到javascript？

Question

目前，我仍在思考整个 Angular 2 概念。我以前用过 AngularJS (1)，我喜欢它。

所以目前我正在开始一个新项目，我想为什么不开始使用 Angular 2。现在我知道每个人都在使用 Typescript 而不是 javascript。但是，我仍然不确定如何使项目可在简单的网络托管服务器(PHP、HTML、MySQL、Javascript 等)上运行。

我知道我可以在我的 Linux 服务器上运行 npm start，但是如何将它放在托管服务器上呢？我不能只将 Typescript 编译为 javascript，这样我就可以在浏览器中使用它而不必运行 npm 吗？我阅读了一些关于 JSPM 和其他一些内容的文章，但我不确定这是否是我需要的，也不知道如何使用 JSPM 或类似的东西(例如使用 JSBPM 的“5 分钟内快速入门”)来运行它。

我知道 Angular 2 有一个 javascript 部分，它对我有用。但是没有编码示例，您在互联网上找到的所有内容都是 Typescript。因此，由于缺少教程，我无法继续在 javascript 中运行 Angular 2。

简而言之，我不介意使用 Typescript，但我只想要一个纯 javascript 作为结果，我可以将其导入 HTML 并从那里开始。

还有一个旁注问题，在运行生产时是否需要存在所有 node_modules？

解释这一点的教程可加分!

谢谢!

Answer 1

事实上，angular.io 网站上有一篇关于此的文档:

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

它展示了将 TypeScript 代码转换为 ES5 代码的方法，看来这就是您要找的东西。

这是一个示例:

• typescript

  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';};
  

  在哪里可以这样做;-)

  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';
    }
  });
  

关于 Angular2 应用程序的打包，您可能也会对这个问题感兴趣:

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