i also try to use aws-sdk with angular 2 (angular cli generated) project. i was not able to load the libs correct in the browser.
according to the angluar doc i was import the aws libaries (https://github.com/angular/angular-cli/wiki/3rd-party-libs#adding-underscore-library-to-your-project).
this looks like this:
edit package.json to load JS file from NPM to local system
{
...
"dependencies": {
"aws-sdk": "git://github.com/aws/aws-sdk-js.git#support/typescript"
},
...
}
edit angluar-cli-build.js to copy aws JS files during build process to vendor folder of dist
var Angular2App = require('angular-cli/lib/broccoli/angular2-app');
module.exports = function(defaults) {
return new Angular2App(defaults, {
vendorNpmFiles: [
...
'aws-sdk/**/*.js'
]
});
};
edit map section in system-config.ts to map namespace to destination file
const map: any = {
'aws-sdk': 'vendor/aws-sdk/dist/aws-sdk.js'
};
in my typescript file i try to import the AWS libs.
...
import * as AWS from 'aws-sdk';
...
@Injectable()
export class MyService {
public myMethod() {
var s3 = new AWS.S3();
...
...
...
this is all fine for typescript compiler, the source file is also loaded in the browser but it result in the error like "S3 is not a constructor".
if you debug the stuff you will see that the AWS stuff is initialized fine but after the "import * as AWS from 'aws-sdk'" is executed the var AWS is initialized with some crazy object.
therefor my solution is:
edit package.json to load JS file from NPM to local system
{
...
"dependencies": {
"aws-sdk": "git://github.com/aws/aws-sdk-js.git#support/typescript"
},
...
}
edit angluar-cli-build.js to copy aws JS files during build process to vendor folder of dist
var Angular2App = require('angular-cli/lib/broccoli/angular2-app');
module.exports = function(defaults) {
return new Angular2App(defaults, {
vendorNpmFiles: [
...
'aws-sdk/**/*.js'
]
});
};
add import of script to index.html
<script src="/vendor/aws-sdk/dist/aws-sdk.js" type="text/javascript"></script>
finaly use it in your service
// make AWS as 'any' available for typescript compiler
declare var AWS:any;
@Injectable()
export class MyService {
public myMethod() {
var s3= new AWS.S3();
...
...
...
This is a mixed way. Use Angluar 2 build process, use NPM package management but do not use AWS typescript type definitions.