web-dev-qa-db-ja.com

ホスティングAngular 2アプリ

私はAngular 2、ホストを知っていますAngular 1.xGoDaddyのような共有ホスティングについてですが、どのように公開するかわからないAngular 2アプリケーション、たとえば、この構造フォルダーがあります。

angular2-quickstart

--app
  app.component.ts
  main.ts

--node_modules

--typings

index.html
package.json
styles.css
systemjs.config.js
tsconfig.json
typings.json

FTPでアップロードする必要があるファイルは何ですか？

進め方が分からないので何もしませんでした
前もって感謝します！

javascriptangularjsnode.jsangularhosting
11
user1608228

コンポーネントベースの言語として、angular 2にはデプロイメントプロセスにいくつかの注意が含まれています。最初に、開発環境で使用されるファイルは必ずしも本番環境に出荷されるわけではありません。 .js、.html、および.cssファイルをアップロードします。

2つ目は、アプリケーションが上記のファイルのみをデプロイする場合でも、次のプロセスを含めることをお勧めします。

バンドル：すべての.jsファイルを単一のファイルにコンパイルします。たとえば、vendor.jsにはすべてのサードパーティ製ライブラリを含めることができ、bundle.jsにはすべてのアプリケーション.jsファイルを含めることができます。 （バンドルはパフォーマンス上の理由からインポートされますが、http 2の到来により、このプロセスは中止されることに注意してください）

縮小：すべてのWebアプリで標準的なプロセスですが、バンドルされたファイルのみを縮小します。

この記事では、展開プロセスに役立つツールの例をいくつか紹介しています。 http://www.ninjaducks.in/hacking/angular-setup/

5
Daniel Pliscki

バックエンドがない場合、無料のホスティングサイトは通常、index.htmlを探して仕事を始めます。したがって、フォルダー構造は正しいですが、tsファイルの代わりにjsファイルをアップロードする必要があります。

5
eko

人気のあるワークフローの1つは、.tsファイルをgulp-TypeScriptし、結果の.jsファイルを配布フォルダーに送信することだと思います。多くの.jsファイルは、「gulp-concatenated」（gulp-concat）で1つのファイルにすることもできます。

もちろん、htmlファイルとcssファイルも送信する必要があります。

Angular2ライブラリはnode_modulesフォルダーの内容にも大きく依存しているため、package.jsonとnpmインストールをサーバー側にアップロードする必要があります。 node_modulesのアップロードを試みることもできますが、アップロードには時間がかかります。

4
Pat M

さて、ルートアプリケーションディレクトリでng buildを実行できます。アプリとファイルを含むdistディレクトリが作成されます。このディレクトリは、Webサーバーがindex.htmlを検索するページに配置できます。

1
Max

Webpackやangular-cliなどのツールを使用して、angular2プロジェクトをビルドする必要があります。これは、beta.14リリース後のwebpackも使用します。 Webpackは配布ディレクトリ-dist-を作成します。これはサーバーにデプロイできます。 Webpackは、すべてのコードを単一のファイルにバンドルして、distフォルダー内に配置します。次に、angular2アプリのコードとデプロイメント構造を理解するための優れたリソースを示します。 https://github.com/mirkonasato/angular2-course-webpack-starter

上記のディレクトリのクローンを作成し、「npm install」を実行してすべての依存関係をインストールし、「npm run build」を実行すると、配布可能な配布フォルダー-dist-が表示されます。

1
UsmanChaudhri