aws S3のホスト用Angularプロジェクトにjs sdkを正しく追加して参照する方法

Question

AWS S3で静的なサイトとしてホストするAngular（4）SPAを作成しています。AWS API Gatewayも使用しています。

API-Gatewayが生成するSDK（JavaScriptの1つ）（libフォルダ、apigClient.js、README.md）があります。プロジェクト（angle-cliで作成されたプロジェクトで、フォルダにはsrcとpackage.jsonファイルも含まれています）、index.htmlファイルで参照すると、ローカルでng serve、さらにng serve --prod --aotと大きく動作します。私はその後、ng build --prod --aotでプロジェクトを作成し、S3バケットと、すべてのサイトにdistのフォルダ内のすべてのものをアップロード

... 
<script type="text/javascript" src="lib/axios/dist/axios.standalone.js"></script> 
<script type="text/javascript" src="lib/CryptoJS/rollups/hmac-sha256.js"></script> 
<script type="text/javascript" src="lib/CryptoJS/rollups/sha256.js"></script> 
<script type="text/javascript" src="lib/CryptoJS/components/hmac.js"></script> 
<script type="text/javascript" src="lib/CryptoJS/components/enc-base64.js"></script> 
<script type="text/javascript" src="lib/url-template/url-template.js"></script> 
<script type="text/javascript" src="lib/apiGatewayCore/sigV4Client.js"></script> 
<script type="text/javascript" src="lib/apiGatewayCore/apiGatewayClient.js"></script> 
<script type="text/javascript" src="lib/apiGatewayCore/simpleHttpClient.js"></script> 
<script type="text/javascript" src="lib/apiGatewayCore/utils.js"></script> 
<script type="text/javascript" src="apigClient.js"></script> 
</head> 
... 

からの輸入のいずれかを除いて正常に動作します：ここでは、index.htmlファイルの関連部分ですAPIゲートウェイSDK。彼らはすべてでそれを探して404を返し、他のライブラリは同じことを取得します。

このシナリオでは、このSDKを使用する正しい方法は何ですか？つまり、apigClient.jsとlibフォルダはどこに置くべきですか。サイトを静的サイトとしてアップロードしたAWS S3）？

Answer 1

私はそれが「/資産/」フォルダを自動生成して、それを入れていることの発見方法は、（私は/ /資産/ JSの下の任意のJavaScriptファイルを置く）、その後のindex.htmlが

<script type="text/javascript" src="assets/js/apiGateway/lib/axios/dist/axios.standalone.js"></script> 
... 
<script type="text/javascript" src="assets/js/apiGateway/apigClient.js"></script> 

のようなものを持つことができます

その後、それはすべて、一緒に

をコンパイルし、この特定のケースでは、私は必要な変数が、私はへの呼び出しを行うために使用していrequests.service.tsの上部にdeclare var apigClientFactory: any;を置くことによって参照することができますAPIゲートウェイ。

Answer 2

src = "apigClient.js"の参照は、あなたのウェブサイトのルート（この場合はs3バケット）からの相対パスです。あなたのバケツを見て、ライブラリが実際にどこにあるかを確認してください。私はそれがhttp://<my-bucket>/<my-app>/apigClient.jsのようなものだと思うし、バケットがデフォルトで公開されていないので、アップロード後に公開されているかどうかを確認してください。