Использование aws-sdk с angular2

Я пытаюсь получить мое приложение Angular2, чтобы разрешить мне читать и записывать в ведро s3 на моей учетной записи AWS.

В AngularJS (и большинстве других вещей) мы использовали aws-sdk, поэтому я предполагаю, что то же самое можно сделать и для Angular2.

Проблема, с которой я сталкиваюсь, заключается в том, чтобы aws-sdk импортировать правильно в мой проект.

Я установил его через npm install aws-sdk

Я попытался импортировать его с помощью

import * as AWS from 'aws-sdk/dist/aws-sdk',
import * as AWS from 'aws-sdk',
import AWS from 'aws-sdk'
import AWS from 'aws-sdk/dist/aws-sdk'

но он продолжает говорить мне, что модуль не существует.

Мой проект основан на angular2 -seed.

Я также попытался установить файл typings из DefinitleyTyped с помощью typings install aws-sdk, но это также не удалось.

Я не уверен, если мне нужно добавить что-нибудь еще, чтобы оно работало или нет.

Кроме того, я использую typescript

Спасибо за ваше время и помощь.

Ответ 1

Из документов aws-sdk на NPM (https://www.npmjs.com/package/aws-sdk)

Использование TypeScript

AWS SDK для пакетов JavaScript TypeScript для использования в проектах TypeScript и для поддержки инструментов, которые могут читать файлы .d.ts. Наша цель - сохранить эти файлы определения TypeScript обновленными в каждой версии для любого публичного api.

Предпосылки Прежде чем вы сможете начать использовать эти определения TypeScript в своем проекте, вам необходимо убедиться, что ваш проект соответствует нескольким из этих требований:

Использовать TypeScript v2.x
Включает определения TypeScript для node. Вы можете использовать npm для установки этого, введя следующее в окно терминала:

npm install --save-dev @types/node

В вашем tsconfig.json или jsconfig.json включены "dom" и "es2015.promise" в compilerOptions.lib. См. tsconfig.json для примера.

В браузере
Чтобы использовать файлы определения TypeScript с глобальным объектом AWS в интерфейсном проекте, добавьте следующую строку в начало вашего файла JavaScript или TypeScript, где вы собираетесь использовать его, или добавьте его в типы tsconfig ' или файл деклараций:

/// <reference types="aws-sdk" />

Это обеспечит поддержку глобального объекта AWS.

Предыдущий ответ
Я обнаружил, что если я добавил

{ src: 'aws-sdk/dist/aws-sdk', inject: 'libs' }

для дополнительных_данных в файле project.config.ts(если используется angular2 -seed) или просто добавьте

<script src="/node_modules/aws-sdk/dist/aws-sdk.js"></script>

на ваш index.html Тогда я мог бы добавить

declare const AWS: any;

Для любого из файлов .ts, которые мне нужны, у меня есть доступ к объекту AWS. Не уверен, что это хорошее решение.

Ответ 2

Но он продолжает говорить мне, что модуль не существует.

TypeScript не знает о модуле, и кажется, что хороших определений не существует. Быстрое исправление:

declare module 'aws-sdk' {
   var foo:any;
   export = foo;
}

Затем вы можете сделать

import * as AWS from 'aws-sdk',

Ответ 3

Я также пытаюсь использовать aws-sdk с проектом angular 2 (angular cli generated). Я не смог загрузить libs правильно в браузере.

в соответствии с angluar doc я был импортирован libs (https://github.com/angular/angular-cli/wiki/3rd-party-libs#adding-underscore-library-to-your-project).

это выглядит так:

изменить package.json для загрузки JS файла из NPM в локальную систему

{
      ...
      "dependencies": {
        "aws-sdk": "git://github.com/aws/aws-sdk-js.git#support/typescript"
      },
      ...
}

редактировать angluar-cli-build.js для копирования файлов aws JS во время процесса сборки в папку поставщика dist

var Angular2App = require('angular-cli/lib/broccoli/angular2-app');

module.exports = function(defaults) {
  return new Angular2App(defaults, {
    vendorNpmFiles: [
      ...
      'aws-sdk/**/*.js'
    ]
  });
};

отредактируйте раздел карты в system-config.ts для сопоставления пространства имен в файл назначения

const map: any = {
  'aws-sdk': 'vendor/aws-sdk/dist/aws-sdk.js'
};

в моем файле typescript я пытаюсь импортировать libs AWS.

...
import * as AWS from 'aws-sdk';
...

@Injectable()
export class MyService { 

    public myMethod() { 
        var s3 = new AWS.S3();
        ...
        ...
        ...

все это отлично подходит для компилятора typescript, исходный файл также загружается в браузере, но он приводит к ошибке, например: "S3 не является конструктором".

если вы отлаживаете материал, вы увидите, что материал AWS инициализирован, но после выполнения "import * as AWS из" aws-sdk "" var AWS инициализируется каким-то сумасшедшим объектом.

, поэтому мое решение:

изменить package.json для загрузки JS файла из NPM в локальную систему

{
      ...
      "dependencies": {
        "aws-sdk": "git://github.com/aws/aws-sdk-js.git#support/typescript"
      },
      ...
}

редактировать angluar-cli-build.js для копирования файлов aws JS во время процесса сборки в папку поставщика dist

var Angular2App = require('angular-cli/lib/broccoli/angular2-app');

module.exports = function(defaults) {
  return new Angular2App(defaults, {
    vendorNpmFiles: [
      ...
      'aws-sdk/**/*.js'
    ]
  });
};

добавить импорт script в index.html

<script src="/vendor/aws-sdk/dist/aws-sdk.js" type="text/javascript"></script>

окончательно используйте его в своем сервисе

// make AWS as 'any' available for typescript compiler
declare var AWS:any;

@Injectable()
export class MyService { 

    public myMethod() { 
        var s3= new AWS.S3();
        ...
        ...
        ...

Это смешанный путь. Используйте процесс сборки Angluar 2, используйте управление пакетами NPM, но не используйте определения типов AWS typescript.