MEAN.IOってフロントエンドをChromeの開発ツールでデバッグしづらい

先に書いたように

MEAN.IOは使用するjavascriptを/bundle/app.jsにまとめてくれる。

なので、軽くなるのだがその分デバッグがしづらい。

Chromeの開発ツールを使うのは不可能。。

node_componentsの中身をデバッグする必要はないので、そこがまとめられているのは

ヨシとして、

packagesの中身がまとめられるのはやめる。

デフォルトで/app.js の45行目あたりpackages内をまとめる部分をコメントアウト

/packages/custom/…./server/views/includes/foot.html

にハードコーディングでインサートしていく。

 

 

MEAN.IOをセットアップ

MEAN.IOを採用。

同じ系統でMEAN.JSというのもあるようだが、MEAN.IOのほうが風説が良いので採用。

MEANコマンドをインストール。

ついでにgulpも

そして、meanコマンドでどこかのフォルダにプロジェクトを展開

すべての質問にデフォルトでリターン連打。

の指示に従って、

gulpを実行

では、サーバを実行。

OK

AWSにNodeJSとMongoDBをセットアップ

AWSにMEANの環境をセットアップする

まずyumアップデート

環境構築に必要なパッケージを一気に取得

Nodejsのインストールのために

nvmをインストール

で、Nodejsのいい感じのバージョンをインストール。

そのいい感じのバージョンをデフォルトとする。

次にMongoDBをインストールする

MongoDBインストール用のyumレポジトリを記述する

それでは、yumでMongoDBをインストール・スタート・起動のたびにスタートするように設定

取り敢えずここまでOK。

 

MEANスタック+Angular Materialを導入してみる

最近流行りのMEANスタック構成をサーバにインストールしてみる。

さらに、個人的に注目のAngular Materialもついでに入れてみる。

丁度、npmの公式HPに次のようなページが用意されている。

https://www.npmjs.com/package/generator-angular-material-fullstack

どうやら、MEANスタック+Angular Materialが手軽にインストールできそうな予感。

早速npmコマンド、、しかし、そもそもまだnpmコマンドをインストールしていない。

いきなりエラーメッセージversionlock。

versionlockを無効化にする。

まだエラー

エラーメッセージfastestmirror。

どうやらRPM パッケージのデータベースが破損したようです。

yumのキャッシュをクリアする。

でもできない。。

単純な理由でした。root権限で実行すればOK。

npmコマンドが使えるようになったので、ここから初めて

AngularJS Material Full-Stackがインストールできるようになる。

取り敢えずココまで問題なし。

ここで、プロジェクトを作成。以下コマンドを実行。

ちなみに、Yeomanとはプロジェクトの雛形生成ツールのことです。

そのコマンドが「Yo」。npmでインストールすることが可能。

しかし、↓みたいなエラー・・

Yeomanが古いからなのかな?

あれ。まだうまくいかない。

npm, nodejsをバージョンアップして、再度Yeomanをバージョンアップして。

もう一度、実行。

なんだか。nodejsのバージョンが低いことでエラーが出てるみたい。

yumでnodejsをインストールするとバージョンがかなり低いのが問題みたい。

nvmで再度nodejsをインストールしてみる。