[AWS]AWS導入メモ3（angular導入）

これも公式通りにangular-cliを使用

https://github.com/angular/angular-cli

■疎通確認
nginxから4200をfowerdingしてもInvalid Host headerになる。
ホスト名チェックでエラーになっているようなので一時的に以下をtrue固定にして確認。動作確認出来たらもとに戻す。

node_modules/webpack-dev-server/lib/Server.js
・checkHostのreturnをtrue固定

■Angularのビルド

ng build

※dist/が作成される

■expressをインストール
angularで作成したフォルダに移動して以下を実行

npm install --save express

expressコマンドが作成した/bin/wwwをコピーしてAngularを表示するようにする
以下を参考
https://qiita.com/frost_star/items/75290a6749fb7933b420

bin/www

// 使用するライブラリの読み込み
const express = require('express');
const path = require('path');
const http = require('http');

// api.js(サーバサイドの処理スクリプト)の読み込み
const api = require('./server/routes/api');

// expressの初期化
const app = express();

// 静的ファイルパスの設定
// ビルド後のAngularのパスを設定する
app.use(express.static(path.join(__dirname, 'dist')));

// /apiでアクセスしたときはapi.jsを表示
app.use('/api', api);

// 任意のURLでアクセスしたときはdist/index.html(Angularのindex.html)を表示
app.get('*', (req, res) => {
  res.sendFile(path.join(__dirname, 'dist/index.html'));
});

/**
 * ポート設定
 */
const port = process.env.PORT || '3000';
app.set('port', port);

/**
 * HTTPサーバの作成
 */
const server = http.createServer(app);

/**
 * ポート監視を開始する
 */
server.listen(port, () => console.log(`API running on localhost:${port}`));

server/routes/api.js

const express = require('express');
const router = express.Router();

router.get('/', (req, res) => {
  res.header('Content-Type', 'text/plain;charset=utf-8');
  res.send('これはサーバサイドスクリプトだよ');
});

module.exports = router;

■実行
forever start ./meanapp/bin/www