Angular2 Appの必要な依存関係をウェブホストにアップロードする

Question

私はAngular2を初めてお持ちで、node.jsとangular2のフレームワークの機能と関係と少し混乱しています。

localhostのlite-serverでアプリケーションを実行できますが、問題はホスティングサービスにアプリをアップロードしていることです。 アプリが用意されているときに何をすべきかのチュートリアルやガイドがないので、webpackでバンドルを作成しようとしていますが、うまくいかないです。 npmによってインストールされたnode_modulesをすべてアップロードするのは悪い習慣ですが、そのようなバンドルを作成しようとしていますか？私のアプリは、（node_modulesのものを含む）html、cssとjsファイルをアップロードすることにより、ちょうど私のアプリを実行できるかどう

もう一つの明確化は可能でしょうか？または、Node.jsで自分のアプリケーションを実行できるホストを設定する必要がありますか？

Answer 1

あなたがTypescriptを使用している場合、Angular2ではウェブアプリケーションをトランスフレイルする必要があります。このファイルは/ distフォルダにファイルを置きます。 ES6を使用している場合は、あなたが開発したルートフォルダにあるアプリケーションを使用します。

私はあなたのブラウザの "index.html"を開きます/あなたのdistフォルダ、angle2作品のアプリです。あなたはこのコードをこのフォルダに

System.import('system-config.js').then(function() { 
    System.import('main'); 
}).catch(console.error.bind(console)); 

あなたはこのコードを持っている/ DISTのごmain.jsで

var _1 = require('./app/'); 

を持っているのindex.htmlで

は、例えば（あなたはこれを持っている必要が）

var ng_fire_component_1 = require('./ng-fire.component'); 

これはwebbappの主成分を呼び出す必要があります。このロジックでは、アプリケーションはng-fire.componentがルートコンポーネントである場合はindex.htmlを開きます。 （使用はJSを表現する場合）にのみ、あなたが開いたときに再び

router.get('/', function(req, res){ 
    res.sendfile('yourAPPfolder/index.html'); 
}); 

ウェブアプリケーションの実行のindex.htmlを呼び出す必要がある、Webサーバを作成し、このWebサーバを必要とするノードで

---

www.yourweb.com/またはlocalhost：yourPort/

最後の質問では、サーバーを使用する場合は、必要なすべてのファイルを持っているフォルダ/ distをこのフォルダにインポートする必要があります。

：

は、私はあなたが他のベンダーのファイルやベンダーのフォルダが必要な場合は、角-CLI-build.js

例えば

ファイルに追加することができます... angular2との仕事のための角度CI（https://cli.angular.io）をお勧め

/* global require, module */ 

var Angular2App = require('angular-cli/lib/broccoli/angular2-app'); 

    module.exports = function(defaults) { 
     return new Angular2App(defaults, { 
     vendorNpmFiles: [ 
      'systemjs/dist/system-polyfills.js', 
      'systemjs/dist/system.src.js', 
      'zone.js/dist/*.js', 
      'es6-shim/es6-shim.js', 
      'reflect-metadata/*.js', 
      'rxjs/**/*.js', 
      '@angular/**/*.js' 
     ] 
     }); 
    };