Angularjsでのノードモジュールの使用

Question

角度アプリケーションでノードモジュールとして使用できるサードパーティモジュールを使用しようとしています。私は角を使用し始めました。私はまだモジュラー動作を完全に理解しています。 角形モジュール（ルータなど）をスクリプトタグでインポートしてメインアプリケーションモジュールに注入していますが、ノードモジュールの注入方法はわかりません。

Googleは、私がCommonJS、AMDなどの言葉でさらに混乱させてしまったので、私はモジュールアプローチについて学び始めたばかりです。 誰かが私のアプリケーションモジュール内にノードモジュールを挿入する方法を教えてもらえますか？

私はAngularJS v1.6.4を使用しています。私はbrowserifyとwebpackを使うオプションがあります。私はそれらを両方持っている。

Answer 1

モジュールをnpmでインストールした後で、scriptタグとともにモジュールを組み込む必要があります。 <script src="node_modules/angular-messages/angular-messages.min.js"></script>

よう

よう

これは、典型的には、他のすべてのスクリプトタグと一緒に、のindex.htmlで行われる（私は、例としてアンギュラメッセージを使用します）。コースはもちろん正確でなければなりません。これはサーバーの視点からのもので、Developer Toolsはファイルが見つからないかどうかを教えてくれます。モジュールフォルダを調べたり、モジュールのreadmeを読み込んで、使用するファイルを見つけなければなりません。ほとんどのモジュールで必要な実際のコードは、単一の.jsファイルです。

パスを短くすることもできます。あなたは急行がルートアンギュラメッセージにnode_modulesに設定されているため

​​

に変化するであろうことは、この

app.use('/angular-messages', express.static(path.join(__dirname, 'node_modules/angular-messages')));

、スクリプトタグのように行われることになる表現を使用する場合/角度メッセージ。

モジュールをAngularJSで使用するには、アプリケーションに依存する必要があります。たとえば：

angular.module('myapp', ['ngRoute', 'ngMessages']).config(config).run(setupAuth)

は、モジュールのREADMEは、あなたのモジュールの名前を教えてくれます。この場合、それはngMessagesと命名されたので、依存関係として追加されました。これは通常、AngularJSアプリケーション（app.jsなど）をブートストラップするファイルで行われます。モジュールの機能については、hereをご覧ください。 2番目のパラメータは通常、依存関係名を含む配列です。

AngularJSモジュールのみがこのアレイに追加されます。例えば、validator.jsのようなAngularJSモジュールではないモジュールを使用するには、別の方法でそれを使用する必要があります。スクリプトは、スクリプトタグに含まれている場合

<script src="node_modules/validator/validator.min.js"></script>

そのコードは、グローバルウィンドウオブジェクトで利用できるようになります。AnglerJS内のウィンドウにアクセスするには、$ウィンドウサービスを使用できます。例えば：

let isItAlpha = $window.validator.isAlpha('test123'));

ファイルvalidator.min.jsは、オブジェクトへのアクセスを提供しますISALPHAと呼ばれる機能が含まれていバリと呼ばれます。 ウィンドウウィンドウウィンドウオブジェクトにvalidator.min.jsから読み取ったコードが含まれているため、$ウィンドウにアクセスするとアクセスできました。これはAngularJS以外のモジュールを使用する最も純粋な方法ではないかもしれませんが、動作します。多くの非AngularJSモジュールにはAngularJSラッパーも別々のモジュールとして用意されています。メインバージョンを使用する前に、AngularJSのバージョンを見つけることができます。

私はbrowserifyとwebpackなどを使用する前に、この方法で動作させることができます。