Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Importing AWS SDK in Angular 2 Application

I am attempting to use the AWS SDK in my Angular 2 application and am getting quite stuck. Here are the steps I have taken:

  1. Installed the aws sdk into my Angular 2 application using npm install aws-sdk
  2. Installed the types using npm install --save-dev @types/node
  3. Attempted to include the AWS modules several different ways in my Angular 2 service: declare var AWS: any;, import AWS = require('aws-sdk');, and finally import * as AWS from 'aws-sdk';.

when I attempt to use the first and third type of import, I don't get a transpiler error until I attempt to access a library within the AWS object, i.e. AWS.config.region = 'us-west-2 gives me the error ';' expected.. And when I attempt to use the second method, I get the error:

Import assignment cannot be used when targeting ECMAScript 2015 modules. Consider using 'import * as ns from "mod"', 'import {a} from "mod"', 'import d from "mod"', or another module format instead.)

Am I missing a step? I've looked at the github project https://github.com/awslabs/aws-cognito-angular2-quickstart/blob/master/src/app/service/aws.service.ts but their project doesn't explain how they imported the SDK.

like image 861
user985030 Avatar asked May 07 '17 17:05

user985030


2 Answers

You need to:

npm install aws-sdk -S

Then make sure you have this type installed (if you are not sure, then just run the code below):

npm install --save-dev @types/node

Now in your src folder, you will find tsconfig.app.ts (make sure not to get confused with tsconfig.ts at the root).

types line is empty and looks like this prior to editing: "types": []. You need to edit it. The tsconfig.app.ts should look like this after you add "types": ["node"]:

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
  "outDir": "../out-tsc/app",
  "module": "es2015",
  "baseUrl": "",
  "types": ["node"]
},
"exclude": [
  "test.ts",
  "**/*.spec.ts"
  ]
}

Now you can just

import * as AWS from 'aws-sdk';
like image 122
Andy Avatar answered Sep 19 '22 19:09

Andy


I am currently working with AWS with angular as my frontend, and am using the same angular cognito quickstart project for my authentication and authorisation flow.

For installation, I used npm install aws-sdk --save

The aws-sdk is under dependencies' in my package.json:

"dependencies": {
    .......
    "aws-sdk": "^2.41.0",
    .......
}

If you are using angular cli, make sure you include the aws-sdk into your angular-cli.json

After these I used declare var AWS: any; And I am able to use the library without any problem.

like image 35
Yap Han Chiang Avatar answered Sep 16 '22 19:09

Yap Han Chiang