Aws-sdk-js: Cannot get aws-sdk working with Angular2

Created on 31 Jan 2017  路  16Comments  路  Source: aws/aws-sdk-js

Would like to request additional documentation: a working demo project with Angular 2. I can't for the life of me get this SDK integrated!

documentation
Source
picture PrismaticPolygon
👍1

Most helpful comment

@tysonhummel I believe the error is due to the @types/node package being installed as a devDependency rather than as a runtime dependency. The instructions in the SDK's readme recommend that you run npm install --save-dev @types/node, as the types are typically not required at runtime but are required by the TypeScript compiler.

The error message indicates that Heroku is running npm install --production on deployed code:

remote: -----> Build failed
remote:
remote: We're sorry this build is failing! You can troubleshoot common issues here:
remote: https://devcenter.heroku.com/articles/troubleshooting-node-deploys
remote:
remote: Some possible problems:
remote:
remote: - A module may be missing from 'dependencies' in package.json
remote: https://devcenter.heroku.com/articles/troubleshooting-node-deploys#ensure-you-aren-t-relying-on-untracked-dependencies
remote:
remote: - This module may be specified in 'devDependencies' instead of 'dependencies'
remote: https://devcenter.heroku.com/articles/nodejs-support#devdependencies
remote:
remote: Love,
remote: Heroku
remote:

If you move @types/node from the "devDependencies" section of your package.json file to its "dependencies" section, Angular AOT compilation should work.

picture jeskew on 14 Jul 2017
👍4 ❤2

All 16 comments

Hey @PrismaticPolygon
There is an Angular 2 quickstart repo that makes use of the SDK that might be a good starting point:
https://github.com/awslabs/aws-cognito-angular2-quickstart

I haven't looked into it in depth. It looks like it doesn't currently make use of the types shipped with the SDK, but that might not be difficult to add in once you get this working.

Let me know if this example works for you! If it's lacking in any way, we want to know that too!

chrisradek picture chrisradek on 31 Jan 2017

Thanks for the speedy response @chrisradek! I have looked around at this repo, but it doesn't use the SDK in a true Angular style - I'm trying to get this working with the Angular build process, rather than importing the script through index.html.

My specific problem is how to tell Angular where to load the SDK from in systemjs.config.js in the official Angular quickstart project: https://github.com/angular/quickstart.

Any pointers would be greatly appreciated. Thanks for your help!

PrismaticPolygon picture PrismaticPolygon on 31 Jan 2017

Ah, understood. Thanks for that feedback!

I would have to play around with Angular 2 and SystemJS before answering that question. This SDK does support webpack though, and it looks like Angular 2 does too!. The SDK just needs the json-loader in webpack config to work.

If you can use webpack, that might be something to try. Otherwise you might try asking on StackOverflow as well, there may be Angular 2 users that have already solved this problem.

chrisradek picture chrisradek on 31 Jan 2017

No-one knows, unfortunately: http://stackoverflow.com/questions/37041049/using-aws-sdk-with-angular2

Thanks for your help - I'll try again. It would be great if you could look into this at some point, I imagine this is actually a fairly limiting issue when it comes to working with Angular2 and the SDK.

PrismaticPolygon picture PrismaticPolygon on 31 Jan 2017

I was able to get the SDK to import with SystemJS. Still troubleshooting how to get the module to work with AOT and Rollup. It is currently causing Rollup to fail.

First you are going to want to include the mapping to the node_module directory in the SystemJS config as follows:

systemjs.config.js

(function (global) {
  System.config({
    paths: {
      "npm:": "node_modules/",
    },
    map: {
      // App
      "app": "",

      // Angular
      "@angular/core": "npm:@angular/core/bundles/core.umd.js",
      "@angular/common": "npm:@angular/common/bundles/common.umd.js",
      "@angular/compiler": "npm:@angular/compiler/bundles/compiler.umd.js",
      "@angular/platform-browser": "npm:@angular/platform-browser/bundles/platform-browser.umd.js",
      "@angular/platform-browser-dynamic": "npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js",
      "@angular/http": "npm:@angular/http/bundles/http.umd.js",
      "@angular/router": "npm:@angular/router/bundles/router.umd.js",
      "@angular/forms": "npm:@angular/forms/bundles/forms.umd.js",

      // Other libraries
      "aws-sdk": "npm:aws-sdk", // Add this line
      "rxjs": "npm:rxjs",
    },
    packages: {
      "app": {
        main: './main.js',
        defaultExtension: "js"
      },
      "rxjs": { defaultExtension: "js" },
    }
  });
})(this);

From there you can import the aws-sdk in the service you are using to carry out the logic.

import "aws-sdk/dist/aws-sdk.min";

Inside the class you can use the window object by declaring the following:

// Initialize AWS
window: any = window;
AWS: any = this.window.AWS;

The snippet above is Typescript. I hope this helps!

cpotter13 picture cpotter13 on 31 Jan 2017
👍2

Your specific steps don't work for me, unfortunately (404s), but I've been down a similar path whereby I pointed Angular to aws-sdk/dist/aws-sdk.js in systemjs.config.js. I found that when I then logged the resulting AWS object, it only had 6 properties:

decode : decode(input)
encode : encode(input)
toASCII : toASCII(input)
toUnicode : toUnicode(input)
ucs2 : Object
version : "1.4.1"

Not the many that the window.AWS object has:

ACM : ()
APIGateway: ()
...

Does your AWS object have all the expected properties? I also hit upon the idea of doing as follows:

(function (global) {
  System.config({
    paths: {
      // paths serve as alias
      'npm:': 'node_modules/'
    },
    // map tells the System loader where to look for things
    map: {
      // our app is within the app folder
      app: 'app',

      // angular bundles
      '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
      '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
      '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
      '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
      '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
      '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
      '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
      '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',

      // other libraries
      'rxjs':                      'npm:rxjs',
      'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js',
      'aws-sdk':                   'npm:aws-sdk'
    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
      app: {
        main: './main.js',
        defaultExtension: 'js'
      },
      rxjs: {
        defaultExtension: 'js'
      },
      "aws-sdk": {
        main: './index.js' //Seems to be where everything should be loaded from
      }
    }
  });
})(this);

But this instead results in a lot of 404s when running on a server - I presume because SystemJS doesn't know where the files are supposed to be loaded from. Interestingly, SystemJS also tries to load all of the JSONs in the aws-sdk/apis directory with an appended .js on all of them. Any updates, please let me know - I'd like to get this working.

PrismaticPolygon picture PrismaticPolygon on 1 Feb 2017

@PrismaticPolygon
I took a look at the Angular 2 quickstart guide and found a way to get the SDK to play nice with SystemJS. I'm not too familiar with SystemJS, it's not clear to me if it supports the browser field in package.json to resolve sub-modules like webpack and browserify do.

Taking the quickstart example in the Angular 2 docs, here's what my updated system.config.js looks like:

/**
 * System configuration for Angular samples
 * Adjust as necessary for your application needs.
 */
(function (global) {
  System.config({
    paths: {
      // paths serve as alias
      'npm:': 'node_modules/'
    },
    // map tells the System loader where to look for things
    map: {
      // our app is within the app folder
      app: 'app',

      // angular bundles
      '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
      '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
      '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
      '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
      '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
      '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
      '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
      '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',

      // other libraries
      'aws-sdk': 'npm:aws-sdk',
      'rxjs':                      'npm:rxjs',
      'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js'
    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
      app: {
        main: './main.js',
        defaultExtension: 'js'
      },
      rxjs: {
        defaultExtension: 'js'
      },
      'aws-sdk': {
        main: 'dist/aws-sdk.min.js',
        defaultExtension: 'js',
        format: 'global'
      }
    }
  });
})(this);

Then in my code, I just import the SDK:

import * as AWS from 'aws-sdk';

Note that this pulls in the distributed browser version of the SDK that's normally treated as a global. The downside here is you can't pull in individual services unless you build a version of the SDK with the services you need yourself. That's something webpack/browserify can already handle.

You do still get to take advantage of the typescript definitions that come shipped with the SDK though using this method.

chrisradek picture chrisradek on 2 Feb 2017
👍1

The above snippet seems to work nicely! Thanks @chrisradek.

To go off your last piece, that was something I left out earlier. I am building a custom sdk using the dist-tools provided in the node module. You just have to include the services you are using.

# Navigate to AWS module
cd node_modules/aws-sdk/

# Build the S3, SNS, SQS, and Elastic Transcoder services
node dist-tools/browser-builder.js s3,sns,sqs,elastictranscoder > dist/aws-sdk.js

# Build and minify the S3, SNS, SQS, and Elastic Transcoder services
MINIFY=1 node dist-tools/browser-builder.js s3,sns,sqs,elastictranscoder > dist/aws-sdk.min.js

You can also use their online builder

cpotter13 picture cpotter13 on 2 Feb 2017

Hi guys,

Thank you very much for your work and examples in this thread @cpotter13 @chrisradek ; Thanks to you I've been able to succesfully include the aws-sdk in Angular 4, using the s3 capabilities to upload files from my app to my s3 bucket.

However, everything was working fine until I tried to take the step from JIT compilation to AOT compilation. I followed every step from Angular guide:

https://angular.io/guide/aot-compiler

Which has worked for another simpler, non-AWS apps, but it didn't work this time; tried building a custom SDK but couldn't manage to include it in my Angular 4 app. I find it surprising that something that works in JIT doesn't in AOT.

Do you have any suggestions, anything I should look at considering your system.config.js above (mine is pretty much the same) and the Angular guide for AOT? Any tips to share?

Thanks in advance!

chjalmar picture chjalmar on 24 Jun 2017

Hi all,
I too have been able to get everything working locally, but I get a string of errors when I try to deploy to heroku:

remote:        ERROR in /tmp/build_6c86e82e98503e334fd0cecfc6e797da/node_modules/aws-sdk/lib/config.d.ts (1,34): Cannot find module 'http'.
remote:        
remote:        ERROR in /tmp/build_6c86e82e98503e334fd0cecfc6e797da/node_modules/aws-sdk/lib/config.d.ts (2,35): Cannot find module 'https'.
remote:        
remote:        ERROR in /tmp/build_6c86e82e98503e334fd0cecfc6e797da/node_modules/aws-sdk/clients/acm.d.ts (108,37): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_6c86e82e98503e334fd0cecfc6e797da/node_modules/aws-sdk/clients/acm.d.ts (110,38): Cannot find name 'Buffer'.

The above is a small sample, the rest are more of the same.

Anyone had any luck using aws-sdk, angular 4 and aot?

tysonhummel picture tysonhummel on 13 Jul 2017

@tysonhummel The SDK requires the @types/node package be installed to use the TypeScript definitions (cf https://github.com/aws/aws-sdk-js#pre-requisites ).

jeskew picture jeskew on 13 Jul 2017

@chjalmar If you do find a solution with AOT compilation, please let me know.

Thanks in Advance

c4adarsh picture c4adarsh on 13 Jul 2017

@jeskew I have followed the instructions provided by the aws-sdk repo to the letter. Those instructions do aid in getting things working in a local dev environment but unless I'm mistaken they don't seem to address issues with angular's AOT build process.

My issue occurs when trying to deploy my project to heroku (worked fine until aws-sdk). My postinstall in package.json is "ng build -prod --aot", which is where I'm experiencing errors.

Here is the full error sequence with a little before and after for context (XXXXX in place of actual project name);

remote:        > ng build -prod --aot
remote:        
remote:       35% building modules 209/222 modules 13 active .       Time: 115310ms
remote:        chunk    {0} 0.a9c7d8410fc52e4882fa.chunk.js (common) 69.9 kB {1} {2} {3} {4} {5} {6} {7} {8} {9} {10} {11} [rendered]
remote:        chunk    {1} 1.5adb954146497aef6b3f.chunk.js 200 kB {2} {3} {4} {5} {6} {7} {8} {9} [rendered]
remote:        chunk    {2} 2.5e1a082327ba47c37056.chunk.js 240 kB {1} {3} {4} {5} {6} {7} {8} {9} [rendered]
remote:        chunk    {3} 3.346b6537688ee30f57f8.chunk.js 53.5 kB {1} {2} {4} {5} {6} {7} {8} {9} [rendered]
remote:        chunk    {4} 4.e8f12cc11f9caac4b2d8.chunk.js 106 kB {1} {2} {3} {5} {6} {7} {8} {9} [rendered]
remote:        chunk    {5} 5.0802a589783a1cd6abf3.chunk.js 40.7 kB {1} {2} {3} {4} {6} {7} {8} {9} [rendered]
remote:        chunk    {6} 6.4c2531703498040dc8c4.chunk.js 98.2 kB {1} {2} {3} {4} {5} {7} {8} {9} [rendered]
remote:        chunk    {7} 7.3d6a903c7901c717bbad.chunk.js 104 kB {1} {2} {3} {4} {5} {6} {8} {9} [rendered]
remote:        chunk    {8} 8.5684674e48c4124c0041.chunk.js 5.42 kB {1} {2} {3} {4} {5} {6} {7} {9} [rendered]
remote:        chunk    {9} main.d7e8259c4fb260d68f12.bundle.js (main) 1.06 MB {12} [initial] [rendered]
remote:        chunk   {10} polyfills.483ae7b00480e63352ed.bundle.js (polyfills) 169 kB {13} [initial] [rendered]
remote:        chunk   {11} styles.cdd5c10f17848433c2b4.bundle.css (styles) 122 bytes {13} [initial] [rendered]
remote:        chunk   {12} vendor.150533cc378e6bb2db71.bundle.js (vendor) 6.57 MB [initial] [rendered]
remote:        chunk   {13} inline.caf546c65045939018c3.bundle.js (inline) 0 bytes [entry] [rendered]
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/lib/config.d.ts (1,34): Cannot find module 'http'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/lib/config.d.ts (2,35): Cannot find module 'https'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/acm.d.ts (108,37): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/acm.d.ts (110,38): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/acm.d.ts (344,32): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/lib/request.d.ts (1,25): Cannot find module 'stream'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/lib/request.d.ts (132,45): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/lib/http_response.d.ts (1,25): Cannot find module 'stream'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/lib/http_response.d.ts (14,18): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/apigateway.d.ts (1071,23): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/clouddirectory.d.ts (973,38): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/cloudsearchdomain.d.ts (41,23): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/cloudtrail.d.ts (141,28): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/codecommit.d.ts (639,22): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/directconnect.d.ts (757,28): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/dms.d.ts (416,35): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/dynamodb.d.ts (309,38): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/lib/dynamodb/document_client.d.ts (2,25): Cannot find module 'stream'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/lib/dynamodb/document_client.d.ts (86,30): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/lib/dynamodb/document_client.d.ts (190,38): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/dynamodbstreams.d.ts (92,38): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/ec2.d.ts (2691,23): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/ecr.d.ts (612,31): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/firehose.d.ts (144,22): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/glacier.d.ts (1116,24): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/lib/services/glacier.d.ts (10,28): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/iam.d.ts (1095,32): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/iam.d.ts (3047,35): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/iotdata.d.ts (73,30): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/iotdata.d.ts (74,25): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/kinesis.d.ts (221,22): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/kms.d.ts (328,32): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/kms.d.ts (962,31): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/lambda.d.ts (331,23): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/lambda.d.ts (332,28): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/lexruntime.d.ts (33,28): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/polly.d.ts (69,29): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/rekognition.d.ts (561,27): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/s3.d.ts (746,22): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/s3.d.ts (1050,42): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/s3.d.ts (3217,32): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/ses.d.ts (1127,32): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/sns.d.ts (275,24): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/sqs.d.ts (192,24): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/support.d.ts (336,22): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/waf.d.ts (424,39): Cannot find name 'Buffer'.
remote:        
remote:        ERROR in /tmp/build_2f224e792df4eb469efd7d3952ad5b64/node_modules/aws-sdk/clients/wafregional.d.ts (468,39): Cannot find name 'Buffer'.
remote:        npm ERR! code ELIFECYCLE
remote:        npm ERR! errno 1
remote:        npm ERR! [email protected] postinstall: `ng build -prod --aot`
remote:        npm ERR! Exit status 1
remote:        npm ERR!
remote:        npm ERR! Failed at the [email protected] postinstall script.
remote:        npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
remote:        
remote:        npm ERR! A complete log of this run can be found in:
remote:        npm ERR!     /app/.npm/_logs/2017-07-13T22_43_43_762Z-debug.log
remote: 
remote: -----> Build failed
remote:        
remote:        We're sorry this build is failing! You can troubleshoot common issues here:
remote:        https://devcenter.heroku.com/articles/troubleshooting-node-deploys
remote:        
remote:        Some possible problems:
remote:        
remote:        - A module may be missing from 'dependencies' in package.json
remote:        https://devcenter.heroku.com/articles/troubleshooting-node-deploys#ensure-you-aren-t-relying-on-untracked-dependencies
remote:        
remote:        - This module may be specified in 'devDependencies' instead of 'dependencies'
remote:        https://devcenter.heroku.com/articles/nodejs-support#devdependencies
remote:        
remote:        Love,
remote:        Heroku
remote:
tysonhummel picture tysonhummel on 14 Jul 2017

@tysonhummel I believe the error is due to the @types/node package being installed as a devDependency rather than as a runtime dependency. The instructions in the SDK's readme recommend that you run npm install --save-dev @types/node, as the types are typically not required at runtime but are required by the TypeScript compiler.

The error message indicates that Heroku is running npm install --production on deployed code:

remote: -----> Build failed
remote:
remote: We're sorry this build is failing! You can troubleshoot common issues here:
remote: https://devcenter.heroku.com/articles/troubleshooting-node-deploys
remote:
remote: Some possible problems:
remote:
remote: - A module may be missing from 'dependencies' in package.json
remote: https://devcenter.heroku.com/articles/troubleshooting-node-deploys#ensure-you-aren-t-relying-on-untracked-dependencies
remote:
remote: - This module may be specified in 'devDependencies' instead of 'dependencies'
remote: https://devcenter.heroku.com/articles/nodejs-support#devdependencies
remote:
remote: Love,
remote: Heroku
remote:

If you move @types/node from the "devDependencies" section of your package.json file to its "dependencies" section, Angular AOT compilation should work.

jeskew picture jeskew on 14 Jul 2017
👍4 ❤2

@jeskew I could kiss you. Successful AOT build/deployment after moving @types/node to prod dependencies!

Thank you so much.

tysonhummel picture tysonhummel on 14 Jul 2017
😄1

In my case importing AWS as

import * as AWS from 'aws-sdk';

worked. Thanks @chrisradek for that

ghost picture ghost on 10 Mar 2018
👍2
Was this page helpful?
0 / 5 - 0 ratings

Related issues

hashans picture hashans  路  3Comments
schatekar picture schatekar  路  3Comments
ddo88 picture ddo88  路  3Comments
Usamaliaquat123 picture Usamaliaquat123  路  3Comments
ranode picture ranode  路  4Comments