typescript/jquery/webpackアプリでaws-sdkを使用する

Question

こんにちは私は最近のすべてのリリースでtypescript/jquery/webpackアプリを持っています。すべてがうまくいきます。 私はそれにaws-sdkを導入したかったのです。私は仕事をする '_'のような他のライブラリをインポートするために私が使ったパターンに従った。

ERROR in .../code-projects/.../tsconfig.json 
error TS2318: Cannot find global type 'Number'. 

ERROR in .../code-projects/.../tsconfig.json 
error TS2318: Cannot find global type 'Object'. 

ERROR in .../code-projects/.../tsconfig.json 
error TS2318: Cannot find global type 'RegExp'. 

ERROR in .../code-projects/.../tsconfig.json 
error TS2318: Cannot find global type 'String'. 

が、私はその後、typescriptですためaws-sdk instructionsに従っ：私はそれを実行するために行くときに何が起こるか

import * as _ from '../node_modules/lodash-es/lodash'; 

は、私はこのようなエラーの束を取得することです。

と同じ結果です。

輸入私たちは以下の通りです：

import * as AWS from '../node_modules/aws-sdk/dist/aws-sdk'; 

とwebstormは文句はありませんし、オートコンプリート作品。

これが役立つ場合は、私のwebpackが含まれています。

質問：このタイプのフレームワークにaws-sdkを含める適切な方法は何ですか。

const webpack = require('webpack'); 
const path = require('path'); 
const CleanWebpackPlugin = require('clean-webpack-plugin'); 
const HtmlWebpackPlugin = require('html-webpack-plugin'); 


module.exports = { 

    entry: [ 
     "bootstrap-webpack", 
     './src/index.ts' 
    ], 

    module: { 
     rules: [ 
      // the url-loader uses DataUrls. 
      // the file-loader emits files. 
      { 
       test: /\.html$/, 
       loader: 'raw-loader', 
       options: { 
        minimize: true 
       } 
      }, 
      { 
       test: /\.js$/, 
       exclude: /node_modules/, 
       loader: 'babel-loader' 
      }, 
      {test: require.resolve("jquery"), use: "imports-loader?$=jquery"}, 
      { 
       test: /\.(woff|woff2)(\?v=\d+\.\d+\.\d+)?$/, 
       loader: 'url-loader?limit=10000&mimetype=application/font-woff' 
      }, 
      {test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=10000&mimetype=application/octet-stream'}, 
      {test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file-loader'}, 
      {test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=10000&mimetype=image/svg+xml'}, 
      { 
       test: /\.png$/, 
       exclude: /node_modules/, 
       loader: 'url-loader' 
      }, 
      { 
       test: /\.gif/, 
       exclude: /node_modules/, 
       loader: 'url-loader' 
      }, 
      { 
       test: /\.jpg/, 
       exclude: /node_modules/, 
       loader: 'url-loader' 
      }, 
      { 
       test: /\.css$/, 
       exclude: /node_modules/, 
       loader: "style-loader!css-loader" 
      }, 
      {test: /\.ts$/, loader: 'ts-loader', exclude: /node_modules/}, 
      { 
       test: /.json$/, 
       loaders: ['json'] 
      } 
     ] 
    }, 
    resolve: { 
     extensions: ['.js', '.ts'] 
    }, 
    output: { 
     filename: 'bundle.js', 
     path: path.resolve(__dirname, 'dist') 
    }, 

    plugins: [ 

     new HtmlWebpackPlugin({ 
      template: './src/index.html', 
      hash: true 

     }), 
     new webpack.LoaderOptionsPlugin({ 
      debug: true 
     }), 
     new CleanWebpackPlugin(['dist/*.*'], {}) 
    ] 
}; 

Answer 1

さまざまな結果が得られました。私は私のプロジェクトをコンパイルできる時点に達しましたが、実行時にはコンストラクタとメソッドがすべて存在しないために失敗します。私はこれがタイプの読み込みの問題だと思った？それを正しく記述する方法さえありません。

しかし、typescriptモジュールとコンパイルモジュールタイプについて読むと、私はhereから答えを得ました。

それは物事の組み合わせでした。記事やコメントから1から1：

問題の説明最初の...

は、AWS-SDKの事前に構築されたバージョンを使用してください。それを使用すると、すべての依存関係が単一ファイル に含まれているため、 のrequire（）問題が回避されます。

aws-sdkノードモジュールでは、事前構築ファイルは dist/aws-sdk.jsにあります。 require（ 'aws-sdk/dist/aws-sdk'）でインポートできます。

もう1つ問題があります。事前ビルドされたファイルは変数 をエクスポートしませんが、その代わりにAWSをウィンドウオブジェクトに追加するだけです。

私はそれをウィンドウオブジェクトに追加すると機能しませんでした。

import '../node_modules/aws-sdk/dist/aws-sdk'; 
declare const AWS: any;